如何解决如何在 material-ui 中设置 ToggleButon 的样式
我正在尝试设置 ToggleButton 的样式以在它被选中时覆盖默认颜色。但它不起作用。
copying MANIFEST.in -> mypkg-0.0.1
copying setup.py -> mypkg-0.0.1
copying mypkg\main.py -> mypkg-0.0.1\mypkg
copying mypkg\__init__.py -> mypkg-0.0.1\mypkg
copying mypkg.egg-info\PKG-INFO -> mypkg-0.0.1\mypkg.egg-info
copying mypkg.egg-info\SOURCES.txt -> mypkg-0.0.1\mypkg.egg-info
copying mypkg.egg-info\dependency_links.txt -> mypkg-0.0.1\mypkg.egg-info
copying mypkg.egg-info\top_level.txt -> mypkg-0.0.1\mypkg.egg-info
copying mypkg\files\somewhat.csv -> mypkg-0.0.1\mypkg\files
解决方法
解决方案
尝试将您的 makeStyles
样式更改为以下内容:
const useStyles = makeStyles((theme) => ({
toggleButtonSelected: {
"&.MuiToggleButton-root": {
"background-color": "red"
}
}
}));
说明
您原来的 makeStyles
样式不起作用,因为它生成了一个带有 .makeStyles-toggleButtonSelected-1
选择器的 CSS 规则(在上面的屏幕截图中以红色圈出),它被另一个具有更高 {{3} 的规则覆盖}.
使用我们新的 makeStyles
样式,它会生成一个 CSS 规则,其中选择器的选择性高于原始样式(下图中红色圈出)。这种新样式可以成功覆盖默认样式。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。