美文网首页
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