reactjs - createMuiTheme 是否为缺少的属性提供默认值？

Question

我正在使用 createMuiTheme() 创建主题:

import { createMuiTheme, responsiveFontSizes } from '@material-ui/core/styles';

const theme = responsiveFontSizes(
  createMuiTheme({
    palette: {
      type: 'dark',
      primary: {
        main: '#c5cae9',
        light: '#f8fdff',
        dark: '#9499b7',
        contrastText: '#212121',
      },
      secondary: {
        main: '#5c6bc0',
        light: '#8e99f3',
        dark: '#26418f',
        contrastText: '#ffffff',
      },
    },
    typography: {
      fontFamily: [
        'Roboto',
        'Arial',
        '"Helvetica"',
        'sans-serif',
      ].join(','),
    },
  }),
);

export default theme;

查看 default theme 时，我遗漏了很多属性，例如 breakpoints、direction、shadows、spacing 等

即使省略了这些属性，createMuiTheme() 是否提供填充这些字段的默认值？还是我必须自己提供这些值。

Answer 1

看看createMuiTheme options 签名

(Object): Takes an incomplete theme object and adds the missing parts.

是的，您的自定义主题将与 MUI 的默认主题合并。查看docs here

const options = {palette:{/*such empty*/}}

export const theme = createMuiTheme(options)