javascript - 如何在 ReactJs 中管理样式

Question

我正在努力学习反应。到目前为止，我在 java 脚本中看到了很多样式变化。据我所知，样式只能由 css 文件管理。但我不确定这条规则是否也适用于 React。什么是反应的最佳实践。例如，下面的代码是干净的代码，还是改变 React 组件中的样式有异味，需要重构？如果是这样，它如何被重构？

“const Color = ({ title, color}) =>
    <section className="color">
        <h1>{title}</h1>
        <div className="color" 
             style={{ backgroundColor: color }}>
        </div>
    </section>”

标签： javascriptcssreactjs

Answer 1

这完全取决于我们的要求和偏好。内联样式只关注写入它们的组件。您可以根据您的组件构建 css，使其可重用。您可以在变量以及单独的资产目录中将 css 声明到组件中。

好吧，它更多地是关于代码的可读性和可重用性。Webpack将你所有的 css/scss 写入一个文件并注入到你的index.html. 您应该研究JSS，以便您可以编译您的 css，然后将其作为 props 注入到您的组件中。无论如何，您可以利用很多资源。