如何使用 css 模块动态访问 bem 样式选择器？答案

【问题标题】：how do you access bem style selectors dynamically using css modules?如何使用 css 模块动态访问 bem 样式选择器？
【发布时间】：2021-11-22 22:47:38
【问题描述】：

例如，我在 App.module.css 文件中有以下选择器：

.Column--active

我想在 React 中使用 css 模块从 App.js 文件中访问这个选择器。首先，我从 css 文件中将所有选择器导入为import styles from './App.module.css'，但是当我尝试在给定的 div 上应用样式时，如下<div className={styles.Column--active}> 我在Column 和之间使用连字符-- 的地方出现错误Active。我尝试用反引号包裹styles.Column--active，但没有成功。有人可以帮忙理解一下吗？

【问题讨论】：

标签： javascript html css css-modules css-loader

【解决方案1】：

一个可能的解决方案是：

<div className={styles['Column--active']}>

【讨论】：