本文介绍了material-ui-如何在替代中引用调色板?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
如何在主题替代中引用调色板?
How can I refer the palette in a theme override?
例如我想将所选的 Tab
更改为具有辅助颜色作为背景,而不是硬编码的 blue
e.g. I want to change the selected Tab
to have the secondary color as background, instead of hardcoded blue
const theme = createMuiTheme({
overrides: {
MuiTab: {
root: {
"&$selected": { backgroundColor: "blue" }, // TODO palette.secondary.main instead of blue
}
}
},
palette: {
primary: { main: "black" },
secondary: { main: "blue" }
}
});
推荐答案
您可以创建可以引用的调色板对象:
You can create palette object that you can refer to:
import { createMuiTheme } from '@material-ui/core';
import createPalette from '@material-ui/core/styles/createPalette';
const palette = createPalette({
primary: { main: "black" },
secondary: { main: "blue" }
});
const theme = createMuiTheme({
overrides: {
MuiTab: {
root: {
"&$selected": { backgroundColor: palette.secondary.main },
}
}
},
palette
});
这篇关于material-ui-如何在替代中引用调色板?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!