reactjs - Material UI AppBar 不会改变主题

Question

我有应用栏

<AppBar position="fixed" className={classes.appBar}>
  <Toolbar style={{ padding: 0 }}>
    <... />
  </Toolbar>
</AppBar>

在我的页面上，当我将 MUI 主题更改为浅色时，它的默认颜色没有改变

import { MuiThemeProvider, createMuiTheme } from "@material-ui/core/styles";

const theme = createMuiTheme({
  palette: {
    type: "dark"
  }
});

ReactDOM.render(
  <MuiThemeProvider theme={theme}>
    <Index />
  </MuiThemeProvider>,
  document.getElementById("root")
);

如果我将它添加到调色板中，那么我的背景会变黑......我以为当我将类型从浅色更改为深色时，我可以更改整体调色板..？

primary: {
  main: "#000000"
}

Answer 1

在 https://material-ui.com/如果您将主题从浅色更改为深色(使用 AppBar 中的灯泡图标)，您会注意到 AppBar 没有变化。

AppBar 默认使用原色作为背景色，从亮到暗切换时原色不会改变。

如果您有一个带有 color="default" 的 AppBar ，那么在从亮到暗切换时会发生变化。您可以在 Simple App Bar 演示中看到这一点:https://material-ui.com/demos/app-bar/#simple-app-bar