美文网首页
react context 配合 ts,每次都要判空

react context 配合 ts,每次都要判空

作者: RickyWu585 | 来源:发表于2023-02-23 01:15 被阅读0次
    • 解决方法:自定义useNonNullContextValue解决
    import React, {useContext} from 'react';
    
    export const useNonNullContextValue = <T, >(context: React.Context<T>) => {
      const contextValue = useContext(context);
      if (!contextValue) {
        throw new Error('useNonNullContextValue must be used within a non-null context');
      }
      return contextValue;
    };
    
    type ContextValue = {
      appState: User,
      setAppState: Dispatch<User>
    };
    
    const Context = createContext<ContextValue | null>(null);
    
    const User = () => {
      const { appState } = useNonNullContextValue(Context);
    
      return <div>
        User:{appState.user.name}
      </div>;
    };
    
    

    相关文章

      网友评论

          本文标题:react context 配合 ts,每次都要判空

          本文链接:https://www.haomeiwen.com/subject/fxszkdtx.html