How can I interpolate JSX with an expression in a string?

Question

Looking to achieve the following:

Obviously this compiles to:

        
                      

              相关标签:
       
      

Answer 1

You could use a react expression and then the javascript es6 string interpolation

Something like this:

<div someProp={`${SomeConstOrVariableOrExpression} simple text`}></div>

Answer 2

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.