javascript - 具有相同定义的 Material ui多个类名

Question

在传统的 CSS 中，以下是定义类间共享属性的常见方式:

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

在 Material UI 中，使用主题化，上面可以翻译成如下:

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

我想知道是否有特定的语法来删除上面的 Material UI 样式方法中的重复，即这两个类是否可以同时定义？，以下内容(伪代码):

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

Answer 1

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

blackBg: {
  backgroundColor: 'black'
}

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

import classNames from 'classnames'

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