我在前端使用react和MaterialUI进行开发，我有很多自定义的输入。除了这次，一切都很顺利。无论我使用哪种选择器组合，我似乎都无法指向正确的选择器来改变这种黑色。
此外，只要查看元素选择器，就可以有一个清晰的识别方法，深入到正确的组件中，这也很好。有没有办法做到这一点(教人钓鱼之类的东西(。这是我检查元素时的图像和我试图获得的颜色。
这是样式对象：
toggleToUse = {
switchBase: {},
thumb: {
color: colorUsedByInputs,
opacity: 0.6,
marginLeft: '10.2px'
},
track: {
background: 'grey',
opacity: '1 !important',
borderRadius: 20,
position: 'relative',
'&:before, &:after': {
display: 'inline-block',
position: 'absolute',
top: '50%',
width: '50%',
transform: 'translateY(-50%)',
color: '#fff',
textAlign: 'center'
}
},
checked: {
'&$switchBase': {
color: '#185a9d',
transform: 'translateX(32px)',
'&:hover': {
backgroundColor: 'rgba(24,90,257,0.08)'
}
},
'& $thumb': {
backgroundColor: '#fff'
},
'& + $track': {
background: 'linear-gradient(to right, rgba(43, 56, 97, 0.7), #2b3861)',
'&:before': {
opacity: 1
},
'&:after': {
opacity: 0
}
}
}
};这是我检查元素时的图像，以及我试图获得的颜色。
<Switch classes={{ track: classes.track }} />
track: {
'.Mui-disabled + &&': {
backgroundColor: 'hotpink',
},
},
这将适用于默认的MUI交换机。如果需要，可以通过在选择器中添加额外的&来提高特异性。如果全部失败，请提供一个代码沙盒，并准确说明您在哪种情况下想要什么颜色。