jss覆盖材料-ui非确定性类

提问于 2024-05-03T04:51:31+08:00

浏览次

0

我正在尝试为材质textField创建自定义样式，并且需要一个达到非确定性类名的JSS选择器 .

风格看起来像这样：

const styles = {
  '@media (min-width: 768px)': {
     borderLabel: {
     top: 2,
     '&.MuiInputLabel-shrink':{
        top: -2,
      }
    }
}

问题是MuiInputLabel-shrink也是由jss生成的，后缀为xxx . 是否有任何选择器可以处理生成的类？

1 回答

0
Material-ui有一个内置的API，你可以覆盖大部分样式 .

假设您在react中使用material-ui，则可以在InputLabel组件的 classes 属性中覆盖shrink .
```
<InputLabel 
    classes={{ 
        shrink: classes.shrinkStyle 
    }} 
/>
```
阅读文档以找到要覆盖的正确组件 . 还有附加代码可以帮助您 . https://codesandbox.io/embed/l32qn5p18q

链接到GitHub中的类似问题：https://github.com/mui-org/material-ui/issues/10468

Now then back to style through JSS

通过嵌套可以使用JSS来设置样式 . 我没有对此进行大量研究，但我知道你可以使用嵌套的JSS . 例：
```
const styles = {
  '@media (min-width: 768px)': {
     borderLabel: {
       //styling
       '&>div':{
         //styling
       }
       '&>div>div>td':{
         '& svg':{
           //styling
         }
       }
     }
   }
}
```
你还应该阅读JSS documentation
回复于 2024-05-03T04:51:31+08:00

相关问题