react之useContext全局状态管理

react之useContext全局变量的统一控制,总结一下使用方法:

在父页面方法外输出一个context:

export const Context: React.Context<{
  // 搜索关键词
  user: any;
  setUser: React.Dispatch>;
}> = createContext(null as any);

在父页面方法内部创建useState并填入dom中:

  // 初始化全局变量
  const [user, setUser] = useState(null);
  return 
    <子页面>
  ;

最后各子页面引入并使用:

// Context来自父页面的export
const { user, setUser } = useContext(Context);

你可能感兴趣的:(javascript,前端,react.js)