类名在 React 16 中没有按预期工作

Question

我想在 react 16 项目 中应用这个 classnames 对象我的输入没有 webpack 工具。

const fieldClassName = classnames( formControlStyles.field, 'form-control' )

您可能会注意到，表单控件 class 来自 bootstrap。

而.fieldclass是我class覆盖一些属性。

请在下面找到 form-control 覆盖 .field class，我希望相反的情况发生。

Answer 1

与 React 无关，这取决于您如何编写 css。例如：

.class1{
 color: red;
 // some property
}

.class2{
 color: green;
 // some property
}

还有一个div元素

<div class="class1 class2"> Text </div>

例如，您在 class1 之后编写了 class2。它将占用 class2 的属性，因此文本将以绿色显示。

    .class2{
      color: green;
      // some property
    }

   .class1{
      color: red;
      // some property
    }

还有一个div元素

<div class="class1 class2"> Text </div>

例如，您在 class2 之后写了 class1。它将占用 class1 的属性，因此文本将以红色显示。

Answer 2

经过很多时间的搜索和询问，我发现正常的样式表文件必须放在 index.js 文件之上，这样它才不会与 classnames 托管样式冲突

类名在 React 16 中没有按预期工作

Classnames not working as expected in React 16

classname

typescript

reactjs

webpack