如何使用CSS模块将类与变量连接

问题描述

我如何转换这个className：

className={`Tooltip__message Tooltip__message--${position}`}

到CSS模块className？

有两类，一类连接一个变量。

解决方法

您可以执行此操作，普通的JavaScript：

className={'wrapper searchDiv ' + this.state.something}

或带有反引号的字符串模板版本：

className={`wrapper searchDiv ${this.state.something}`}

两种类型当然都是JavaScript，但第一种模式是传统类型。

无论如何，在JSX中，用大括号括起来的所有内容都将作为JavaScript执行，因此您基本上可以在该处执行任何操作。但是，结合使用JSX字符串和大括号对属性来说是行不通的。

引用https://stackoverflow.com/a/36209517/10789574