Reactjs 动态更改材质ui主题-->不会影响子级

我正在开发一个react/redux应用程序，其中我使用的是materialui

我正在使用上下文根据文档在CoreLayout组件和顶层组件中设置主题。这在初始负载下工作正常

我希望能够在运行时切换主题。当我选择一个新主题时，我的redux存储会被更新，因此会触发我的组件进行更新。问题是我的CoreLayout组件的子组件没有受到影响——第一次！如果我使用一个选择列表反复更改我的主题，该列表在更改时发送一个redux操作，则子项将被更新。如果一个子组件位于我的项目层次结构的下面两层，它会在两次操作调用后更新-因此上下文如何传递存在一些问题

My CoreLayout.js组件

我的一个子组件LeftNavigation.js

我可以通过this.context.muiTheme访问上下文中的主题。 我可以通过在每个子组件中使用另一个getChildContext实例来让组件更新主题，但是我将拥有大量的组件，我非常希望避免这样做

我的CoreLayout组件的getChildContext方法在我更改主题时被调用，并且我的所有子组件都按预期重新呈现

有什么想法吗

---

更新：至少在iOS上，它可以在移动设备上正常工作。您可以使用muiThemeProvider来避免将getChildContext添加到任何子组件中，该提供程序会为您执行此操作

...

import getMuiTheme from 'material-ui/styles/getMuiTheme';
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
import MyAwesomeReactComponent from './MyAwesomeReactComponent';

const App = () => (
 <MuiThemeProvider muiTheme={getMuiTheme()}>
    <MyAwesomeReactComponent />
 </MuiThemeProvider>
)

...

---

更多信息请参见。

是的，我一开始是这样做的，但我厌倦了必须将其添加到我添加的每个组件中。在将我的RootView包装到

import React from "react";
import { connect } from 'react-redux';


import { List, ListItem } from 'material-ui';

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

export class LeftNavigation extends React.Component {
    render () {

        return (
            <div className="left-pane-navigation">
                <List subheader="My Subheader" >
                    <ListItem primaryText="Search" />
                    <ListItem primaryText="Performance Load" />
                </List>
            </div>
        );
    }
}

LeftNavigation.contextTypes = {
    muiTheme: React.PropTypes.object
};

export default connect(mapStateToProps)(LeftNavigation);

...

import getMuiTheme from 'material-ui/styles/getMuiTheme';
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
import MyAwesomeReactComponent from './MyAwesomeReactComponent';

const App = () => (
 <MuiThemeProvider muiTheme={getMuiTheme()}>
    <MyAwesomeReactComponent />
 </MuiThemeProvider>
)

...