解决 react-create-app 中 css 模块的碰撞 className 没有弹出

Question

如何在没有弹出的情况下解决 react-create-app 中的 css className 冲突问题。 我每次都需要为应用程序的每次呈现创建唯一的类名。

---

例如我想要什么：

1. 第一次渲染：Header_xHtdc
2. 第二次渲染：Header_1dg5c

但现在我经常得到相同的类名

Answer 1

如果您使用的是最新版本的 react，您可以执行以下操作：

1. 将 CSS 文件重命名为 some.module.css（假设之前是 some.css）

2. 像这样导入：

   从'./some.module.css'导入样式；

样式将是一个对象，其键是您在 CSS 文件中定义的 id 和类。

所以如果你有这样的风格：

.parent {
 color: red;
}

你会像这样使用它

className={styles.parent}

在你的 JSX 中。