如何在 React JS 的 html 属性中编写 JavaScript 代码

【问题标题】：How to write JavaScript code inside html attributes in React JS如何在 React JS 的 html 属性中编写 JavaScript 代码
【发布时间】：2016-04-18 22:58:37
【问题描述】：

return(
  <div>
    <Loading loadingMessage="Running "{this.state.programName}" program"/>
  </div>
);

我知道上面的属性loadingMessage 值在语法上是错误的。但我的需要是，我需要从状态中获取 programName 并附加到 loadingMessage 属性值。我怎样才能做到这一点？任何帮助将不胜感激。

【问题讨论】：

标签： javascript reactjs react-jsx jsx

【解决方案1】：

您可以在大括号内编写 javascript，只需将其中的字符串连接起来。

return (
    <div>
        <Loading
            loadingMessage={"Running " + this.state.programName + " program"}
        />
    </div>
);

或使用template literal:

<Loading loadingMessage={`Running ${this.state.programName} program`}/>

【讨论】：