在我的JSX中放置一个条件语句

Question

<li className=`nav-item {(this.props.activeState===1) ? "active":""}`><a href="#">Main</a></li>

^这是我的代码。如果符合条件，我希望类名“active”出现在“nav-item”旁边。我认为使用反引号让我一起使用文本和代码，但是我收到一个错误 - JSX值应该是表达式或带引号的JSX文本

我该如何正确地做到这一点？

Answer 1

您需要将整个模板字符串设为JSX prop表达式：

UIAlertView

使用变量可能更清晰：

<li className={`nav-item ${(this.props.activeState === 1) ? "active": ""}`}>
  ...
</li>