javascript - 如何在 React 中使用 .css 样式表？

Question

所以我有一个非常大的样式表，我正试图在我的 React 代码中使用它。我知道通常你会在 React 中使用这种格式来设置样式:

transparentBg: {
    background: 'transparent'
},

WhiteText: {
    color:'white'
},

但是，我的 css 样式表如下所示:

.transparentBg{
    background: transparent;
}

.WhiteText{
    color:white;
}

有没有办法将我的整个 CSS 样式表转换成 React 风格的格式？或者让我只使用原始 CSS 样式表而不转换它的方法？

Answer 1

您的 CSS 仍然只是 CSS，而 React 仍然只是在页面上呈现 HTML 元素。

这意味着您可以将大型 CSS 文件添加到 html 文件中，只需将您在那里定义的 CSS 类/id 等添加到 React 中的元素。

如果你有

.transparentBg{
    background: transparent;
}

.WhiteText{
    color:white;
}

然后在你的 React 组件中你可以使用这些类:

var SomeComponent = function () {
  return <div className="WhiteText">
    Foo Bar Baz
  </div>;
};