如何在 React JS 中有条件地应用 CSS 类

Question

我一直在思考如何最好地在 React JS 中有条件地应用 CSS 类。我看到了一些答案，但答案并不多，或者它们没有我想要的那么详尽。

原文由 Mr. Benedict 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

您可以简单地将类条件化为状态，如下所示：

 <div className={ this.state.exampleIsTruthy ? 'yourClass' : '' }>
  text
</div>

或者如果你想根据这样的状态切换类：

 <div className={ this.state.exampleTrueOrFalse ? 'shown' : 'hidden' }>
  text
</div>

原文由 Adam Orłowski 发布，翻译遵循 CC BY-SA 4.0 许可协议