无法使用 ReactJS 在最新的 MUI v5 中设置主题答案

【问题标题】：Unable to set theme in latest MUI v5 with ReactJS无法使用 ReactJS 在最新的 MUI v5 中设置主题
【发布时间】：2022-01-25 00:47:44
【问题描述】：

我正在为自己构建一个小而简单的 Wiki；刚开始学习 React，虽然我之前一直在使用 JavaScript。

我似乎无法设置主题。我正在尝试将背景设置为黑色。我正在这样做：

  const darkMode = true;

  const theme = createTheme({
    palette: {
      type: darkMode ? 'dark' : 'light',
      background: {
        default: "#000000",
        paper: "#000000"
      }
    },
  })

然后渲染：

<ThemeProvider theme={theme}>
...
</ThemeProvider>

codesandbox project

github repo，虽然还很年轻。

知道我做错了什么吗？

【问题讨论】：

V5 现在对托盘使用“模式”：mode: darkMode ? 'dark' : 'light',
@Jamie_D：试过了。没有什么不同。
移除背景道具，只需将主题设置为深色
@Jamie_D：我试过你写的。更新并保存了代码沙盒项目。该网站仍然是白色的。我还缺少什么吗？
已更新答案

标签： reactjs material-ui

【解决方案1】：

给子级添加 CssBaseline

import CssBaseline from '@mui/material/CssBaseline';

<ThemeProvider theme={theme}>
  <CssBaseline />
...
</ThemeProvider>

见CssBaseline

【讨论】：

谢谢！太糟糕了，在 ThemeProvider 的文档中没有给出这些信息。
不过，附带说明一下，主题提供者应该是您的 App.js ，为所有子组件提供主题，您需要做的就是在每个子组件中调用 <CssBaseline />。