材质用户界面:无法自定义主题

eta*_*luz 3 reactjs material-ui

我试图像这样自定义我的应用程序的主题(使用Material UI):

https://material-ui.com/customization/themes/#muithemeprovider

src / index.js:

import App from './App';
import MuiThemeProvider from '@material-ui/core/styles/MuiThemeProvider';
import { createMuiTheme } from '@material-ui/core/styles';
import red from '@material-ui/core/colors/red';
import purple from '@material-ui/core/colors/purple';
import green from '@material-ui/core/colors/green';

const theme = createMuiTheme({
  palette: {
    primary: green,
    secondary: green,
  },
  status: {
    danger: 'orange',
  },
});

ReactDOM.render(
  <MuiThemeProvider muiTheme={theme}>
    <App />
   </MuiThemeProvider>
  , document.getElementById('root'));
Run Code Online (Sandbox Code Playgroud)

src / App.js:

import { withTheme } from '@material-ui/core/styles'
class App extends Component {
   ...
}

export default withTheme()(App);
Run Code Online (Sandbox Code Playgroud)

但是,默认主题颜色仍为我显示: 在此处输入图片说明

我正在尝试通过Firebase控制台实现此颜色主题: 在此处输入图片说明 为什么不起作用?

eta*_*luz 5

这行:

  <MuiThemeProvider muiTheme={theme}>
Run Code Online (Sandbox Code Playgroud)

需要是:

  <MuiThemeProvider theme={theme}>
Run Code Online (Sandbox Code Playgroud)