试试这个 (ES5):

...

或者使用 ES6+

...

记住 { 和 } 之间的一切都只是 Javascript，所以表达式是 'total total-' + obj.state然后设置为DOM节点的类.

Looking to achieve the following:

<div className="total total-{obj.state}">

Obviously this compiles to:

<div class="total total-{obj.state}">

Is there an elegant way in JSX to evaluate the expression in the {} within a string?

Try this (ES5):

<div className={'total total-' + obj.state}>...</div>

Or with ES6+

<div className={`total total-${obj.state}`}>...</div>

Remember that everything between { and } is just Javascript, so the expression is 'total total-' + obj.state which is then set as the class of the DOM node.