CSS-In-Js 在一个 html 元素上使用带有字符串 class 名称的阿芙罗狄蒂样式对象

Question

我现有的项目使用 Bootstrap 并且看起来像：

<ul className=”nav navbar-nav”>

但是阿芙罗狄蒂要求这样的东西：

<ul className={css(styles.red)}>

问题：

如何合并这两种方法？

<ul className=”nav navbar-nav” className={css(styles.red)}>

Answer 1

您可以使用 ES6 模板文字：
className={`nav navbar-nav ${css(styles.red)}`}

或join()方法：
className={['nav navbar-nav',css(styles.red)].join(' ')}

CSS-In-Js Using aphrodite style object with string class names on one html element