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

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

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

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

  // 初始化全局变量
  const [user, setUser] = useState<any>(null);
  return <Context.Provider value={{ user, setUser }}>
    <子页面></子页面>
  </Context.Provider>;

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

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

Logo

腾讯云面向开发者汇聚海量精品云计算使用和开发经验,营造开放的云计算技术生态圈。

更多推荐