How can I interpolate JSX with an expression in a string?
Solution 1:
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.
Solution 2:
You could use a react expression and then the javascript es6 string interpolation
Something like this:
<div someProp={`${SomeConstOrVariableOrExpression} simple text`}></div>