如何从商店数据动态更改主题?

时间:2019-06-21 14:04:34

标签: javascript reactjs react-redux material-ui redux-saga

我正在尝试使用商店(redux)中的数据动态更改MuiThemeProvider颜色。但是,此数据是在App.js中呈现后异步加载的,从而使颜色提供者无法到达主题提供程序。如何异步更新商店?

import './App.css';
import MuiThemeProvider from '@material-ui/core/styles/MuiThemeProvider'
import theme from './config/theme'
import configureStore from './store/store'
import {Provider} from 'react-redux'
import {LocalizeProvider} from "react-localize-redux";
import Router from "./pages/Router";

export const store = configureStore()

class App extends Component {

  render() {
        return (
            <LocalizeProvider>
                <Provider store={store}>
                    <MuiThemeProvider theme={theme}>
                        <Router/>
                    </MuiThemeProvider>
                </Provider>
            </LocalizeProvider>
        );
  }
}

export default App;```

1 个答案:

答案 0 :(得分:0)

componentDidMount() {
  const jssStyles = document.getElementById("jss-server-side");
   if (jssStyles && jssStyles.parentNode) {
        jssStyles.parentNode.removeChild(jssStyles); }
}
render() {
   return (
<Provider store={store}>
   <BrowserRouter>
     <Routes />
    </BrowserRouter>
</Provider>
   );   
 }
 }