在 MUI 中更改原色和二次色

Question

我有一个使用 MUI 的反应应用程序。导入按钮时，可以使用 primary={true} 或 secondary={true} 设置其样式。我想更改 primary 和 secondary 颜色。我发现我可以这样做：

 const theme = createMuiTheme({
  palette: {
    primary: '#00bcd4',
    secondary: '#ff4081'
  }
});

然后在这里我可以使用它：

 <MuiThemeProvider theme={theme}>
  <App/>
</MuiThemeProvider>

但我收到一个错误： createMuiTheme is not a function...

我进入 MUI 包，发现没有这样的文件，当我导入 createMuiTheme 时，我得到 undefined 。它应该是从 material-ui/styles/theme 导入的，但它实际上根本没有这个文件夹！

我正在使用 material-ui@0.19.4 。我将此包更新为 v20 并且仍然没有这样的文件夹。

原文由 Den Gas 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

我注意到的与文档的两个不同之处是 MuiThemeProvider 的道具名称：

 <MuiThemeProvider muiTheme={muiTheme}>
   <AppBar title="My AppBar" />
</MuiThemeProvider>

而且函数不是createMuiTheme而是getMuiTheme：

 import getMuiTheme from 'material-ui/styles/getMuiTheme';

更新：

如果您从包装中打开轻主题，它们没有使用主要或次要，也许您应该尝试这样？

原文由 Eudes 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

新答案

在最新版本的 Material UI 中，createMuiTheme 现已弃用。因此，我们不应该使用 createTheme

 import React from 'react';
import { render } from 'react-dom';
import { MuiThemeProvider, createTheme } from '@material-ui/core/styles';
import Root from './Root';

// use default theme
// const theme = createTheme();

// Or Create your Own theme:
const theme = createTheme({
  palette: {
    secondary: {
      main: '#E33E7F'
    }
  }
});

function App() {
  return (
    <MuiThemeProvider theme={theme}>
      <Root />
    </MuiThemeProvider>
  );
}

render(<App />, document.querySelector('#app'));

旧答案

来自 https://material-ui.com/customization/themes/ ：

 import React from 'react';
import { render } from 'react-dom';
import { MuiThemeProvider, createMuiTheme } from '@material-ui/core/styles';
import Root from './Root';

// use default theme
// const theme = createMuiTheme();

// Or Create your Own theme:
const theme = createMuiTheme({
  palette: {
    secondary: {
      main: '#E33E7F'
    }
  }
});

function App() {
  return (
    <MuiThemeProvider theme={theme}>
      <Root />
    </MuiThemeProvider>
  );
}

render(<App />, document.querySelector('#app'));

原文由 Alan 发布，翻译遵循 CC BY-SA 4.0 许可协议