reactjs - 如何通过 Redux 商店动态更新 Material UI 主题？

Question

我有以下使用自定义 Material UI 主题的 React 组件

const getTheme = name => theme.filter(theme => theme.name === name)[0] ||主题[0]；

const Root = props => (
    <MuiThemeProvider muiTheme={getMuiTheme(getTheme(props.theme).data)}>
        <Router history={history}>
            <Switch>
                <Route component={AppContainer}/>
            </Switch>
        </Router>
    </MuiThemeProvider>
);

它由容器供给

const mapStateToProps = state => ({
    theme: state.settings.theme
});

const RootContainer = connect(mapStateToProps, {})(Root);

当我在设置页面上更新主题名称时，状态会更新(通过 Redux 日志记录确认)，但主题不会更新。但是，当我离开该页面时，将应用新主题。

大概状态的变化不会导致 Root 组件重新渲染，或者有一些我不明白的应用方式

<MuiThemeProvider muiTheme={getMuiTheme(getTheme(props.theme).data)}>

知道如何让主题更新它在状态中更改的实例吗？

Answer 1

事实证明，我还必须将更新的主题作为 Prop 传递给我的应用程序组件(位于层次结构中的根下方)。似乎这与主题是通过上下文传递的事实有关，并且更改配置主题的组件中的 Prop 不足以触发所需的更新。