我想覆盖多个组件的特定样式。目前,它适用于所有组件,但不适用于“选择”。
我在做的是:
MuiSelect: {
styleOverrides: {
select: {
background: themePalette.palette.background.paper,
marginLeft: '0rem',
borderRadius: '10rem',
},
iconOutlined: {
background: themePalette.palette.background.default,
color: themePalette.palette.primary.main,
borderRadius: '10rem',
},
},
variants: [
{
props: { size: 'small' },
style: {
borderRadius: '0.4rem',
select: {
borderRadius: '0.4rem',
},
iconOutlined: {
borderRadius: '0.4rem',
},
},
},
],
},
“styleOverrides”部分中的样式会像预期的那样被覆盖。但该变体从未被应用。对于TextField、ToggleButtonGroups等其他元素。它起作用了。但不知何故,它对精选不起作用。
另外,当我通过sx属性直接覆盖Select控件中的相同属性时,它不会被应用。
sx={{
input: {
borderRadius: '0.4rem',
},
select: {
borderRadius: '0.4rem',
backgroundColor: theme.palette.grey[300],
},
borderRadius: '0.4rem !important',
}}
在这里我也没有任何影响。边界半径仍然保持不变,为'10rem',就像它在stylesOverrides中定义的那样。
这是一个bug,还是我对Select做错了什么?
1条答案
按热度按时间lokaqttq1#
主题 prop 中的
style
和sx
与css选择器一起工作。不使用预定义插槽,如styleOverrides