【问题标题】: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 ,为所有子组件提供主题,您需要做的就是在每个子组件中调用 &lt;CssBaseline /&gt;
猜你喜欢
  • 2021-12-06
  • 2022-10-24
  • 1970-01-01
  • 2022-06-10
  • 2018-12-24
  • 2021-11-17
  • 1970-01-01
  • 2021-11-19
  • 2021-11-23
相关资源
最近更新 更多