材质 ui 具有相同定义的多个类名答案

【问题标题】：material ui multiple classnames with same definition材质 ui 具有相同定义的多个类名
【发布时间】：2019-09-02 02:01:16
【问题描述】：

在传统 CSS 中，定义类之间共享属性的常见方法如下：

.classA,.classB{
  background-color: black;
}

在Material UI中，使用theming，上面可以翻译成如下：

styles = (theme)=>({
    classA:{
      backgroundColor: 'black'
    },
    classB:{
      backgroundColor: 'black'
    },    
})

我想知道是否有特定的语法来删除上述材料 UI 样式方法中的重复项，即两个类可以同时定义吗？如下（伪代码）：

styles = (theme)=>({
    classA,classB:{
      backgroundColor: 'black'
    }, 
})

【问题讨论】：

【解决方案1】：

为什么不为颜色设置一个基类？

blackBg: {
  backgroundColor: 'black'
}

然后使用 classnames 包将多个类名附加到您的元素

import classNames from 'classnames'

...
  <div className={classNames(blackBg, myOtherClass)} />
...

【讨论】：