Material-UI在主题之间来回切换时颜色不变

IT技术 reactjs material-ui jss
2021-04-21 06:49:01

我正在通过状态变量更改应用程序中的主题,MuiThemeProvider 当切换活动主题时,所有组件上的颜色都会正确更新,但仅更新一次。如果我切换回已使用的主题,则颜色不会更新。

https://codesandbox.io/s/focused-mcnulty-0tzm2?file=/src/App.js

您可以在代码和框上看到,如果您要更改的主题已被使用,则来回切换会导致最后一个主题“粘住”。

我可以通过theme.palette.primary.main在设置makeStyles()组件样式时使用on来“修复”这个问题,但这有点违背color了组件属性的目的

2个回答

Material-UI 尚不完全支持StrictModehttps://github.com/mui-org/material-ui/issues/20708)。如果您删除<React.StrictMode>index.js中的标签,它就可以正常工作。

这是您的沙箱的工作版本:https : //codesandbox.io/s/strictmode-theme-switching-issues-7prfe

您可以使用以下导入创建严格模式主题。

import { unstable_createMuiStrictModeTheme } from "@material-ui/core/styles";

但正如你所看到的,它说不稳定,我不知道以这种方式创建主题的缺点,目前它正在处理我的个人项目,同时具有全局严格模式。

文档