Javascript 上下文值不会在主题切换时更新
所以我想根据本地存储值和存储在上下文中的颜色来制作主题。问题是，切换不会更新secondext值，尽管它与布局状态绑定（这恰好是更新，但我希望避免将颜色托盘传递到整个树）。下面我将粘贴提供了上下文的代码，切换按钮嵌套在代码的更深处，但与React文档中的按钮没有区别：Javascript 上下文值不会在主题切换时更新,javascript,reactjs,next.js,Javascript,Reactjs,Next.js,所以我想根据本地存储值和存储在上下文中的颜色来制作主题。问题是，切换不会更新secondext值，尽管它与布局状态绑定（这恰好是更新，但我希望避免将颜色托盘传递到整个树）。下面我将粘贴提供了上下文的代码，切换按钮嵌套在代码的更深处，但与React文档中的按钮没有区别： /./comps/AdminLayout.js 从“React”导入React，{Component}； 从“下一个/头”导入头； 从“/AdminNav”导入AdminNav； 从“../Utils/ThemeContext”导
/./comps/AdminLayout.js
从“React”导入React，{Component}；
从“下一个/头”导入头；
从“/AdminNav”导入AdminNav；
从“../Utils/ThemeContext”导入ThemeContext；
从“../Utils/ColorPalette”导入主题；
导出默认类扩展组件{
静态上下文类型=ThemeSecontext；
建造师（道具）{
超级（道具）；
此.state={
主题：themes.light，
切换：（）=>{
这是我的国家({
主题：（window.localStorage.theme==='dark'
？主题、光
：主题（黑色）
});
window.localStorage.theme=（window.localStorage.theme=='dark'？'light'：'dark'）；
}
};
}
componentDidMount（）{
window.localStorage.theme='light'；
}
切换（）{
}
render（）{
返回(
{`
* {
框大小：边框框；
字体系列：无衬线；
保证金：0；
填充：0；
}
html，正文{
颜色：${this.context.theme.primary}；
框大小：继承；
背景：${this.context.theme.background}；
}
a{
颜色：继承；
文字装饰：无；
}
钮扣{
边界：无；
}
`}
{this.props.title}-下一个商业
{this.props.children}
{`
.布局{
显示器：flex；
}
`}
);
}
}
//./comps/Utils/ThemeContext.js
从“React”导入React；
从“/ColorPalette”导入主题；
const ThemeContext=React.createContext({
主题：themes.light，
切换：（）=>{}
});
导出默认主题文本；
//用于切换主题的按钮-它更改AdminLayout的状态
{（{toggle}）=>(
切换主题
)}