如何在reactjs中的class属性中插入state / props？

Question

我正在研究reactjs，之前我在meteorjs有过一点经验而且我曾经这样做过

<p class= {somehelper}> testing </p>

但是在reactjs中它不像这样工作。这是代码示例。

<div className="col-md-3 {card.insertTime}"> DeadLine :  {card.insertTime}</div>

这里{card.insertTime}没有给予价值。我正在做的错误是什么。

Answer 1

<div className="col-md-3 {card.insertTime}">

将"col-md-3 {card.insertTime}"视为文字字符串。你需要改为字符串连接：

<div className="col-md-3 " + card.insertTime>

一个好的最佳做法是始终在{}中包装字符串以明确分配：

<div className={"col-md-3 " + card.insertTime}>

Answer 2

在这种情况下，您可以使用字符串连接

<div className={ "col-md-3 " + card.insertTime }>Concat</div>

或如果您使用ES2015，则可以使用template literals

<div className={ `col-md-3 ${ card.insertTime }` }>template</div>

Example