CSS-In-Js在一个html元素上使用带有字符串类名的aphrodite样式对象

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(' ')}

示例：https://codesandbox.io/s/o7l833lym6