Reactjs 与Redux和ThemeProvider反应中的主题化

我的应用程序中只有一个主题

ReactDOM.render(
    <Provider store={store}>
        <ThemeProvider theme={theme}>
            <App />
        </ThemeProvider>
    </Provider>,
    root,
);

我的具有类似component.style.js（带有jss）样式的组件文件没有重新渲染。我的应用程序中有了新的主题，但组件有旧的样式

---

我应该在我的商店里储存我的主题吗？有可能在我的应用程序的任何部分更改主题，这是一个好方法吗？你能告诉我如何正确组织主题吗？提前谢谢

根据您的评论，我发现您没有使用UI组件库，而是使用React上下文API来提供主题，并使用Redux来管理应用程序状态

我应该在我的商店里储存我的主题吗

对。因为您已经在使用Redux来处理应用程序状态，所以也不需要混合使用React的上下文API。否则，您将两次解决同一问题，您的代码将更难维护。而是在Redux存储中创建一个表示UI的对象

有可能在我的应用程序的任何部分更改主题，这是一个好方法吗

我不会太担心这个。无论您使用Redux还是React的上下文API，它们都为您提供了从应用程序中的任何位置读取和更新全局应用程序状态的机制。您可以稍后决定是否希望全局应用程序状态中处理UI的部分具有更改处理程序；无论是通过Redux还原程序还是上下文API的使用者

你能告诉我如何正确组织主题吗

看看它是怎么做的。没有比广泛使用的框架更好的指南了

---

回到你最初的问题，“为什么我的应用程序主题没有更新？”。由于您使用的是React的上下文API，因此需要使用使用者组件来更新提供者的值。您的上下文提供程序将通知更改的子组件，并且它们将重新提交。如果使用对象分配，则不会运行此逻辑。

为什么必须在窗口中放置主题？为什么不能使用提供者的上下文？我想快速检查主题更改是否有效。这就是我在窗口中放置主题的原因。如果将主题放置在窗口对象中，然后更改窗口对象主题，这不会反映在React中，因为它超出了库的生命周期。为了使主题更改生效，必须对React库中的主题执行（并应用）这些更改。您是否使用任何特定的React UI库？不，我没有使用任何UI库，如Material Design。在我的redux商店中存储我的主题是否正确？

<ThemeProvider theme={window.theme}>
    <App />
</ThemeProvider>

Object.assign(window.theme, newTheme)