如何将变量传递到 Material ui 组件的 HTML 标签中？

Question

我正在使用以下 Material ui 组件：

<CardTitle children={child} />

现在我想添加一些 HTML 包含变量的代码，它会随着我的反应组件的状态而改变

...
render() {
  const child = (<p>this.state.var</p>);

  return (
    ...
    <CardTitle children={child} />
    ...
  );
}
...

}

如何实现？

我是否必须创建另一个组件，并将其包含为 HTML 标记？

Answer 1

检查这个 jsfiddle，我们可以在 CardTitle 中使用 html 元素： https://jsfiddle.net/cy167jme/

Answer 2

根据版本 4 CardHeader 中的文档，标题字段具有 node 类型。因此你可以使用例如

<CardHeader title={<div>{addressFrom} &rarr; {addressTo}</div>} />

How to pass a variable into HTML-tags of a Material ui Component?