javascript - 使用 React 变量语句 (JSX) 插入 HTML

Question

我正在使用 React 构建一些东西，我需要在 JSX 中插入带有 React 变量的 HTML。有没有办法有一个像这样的变量:

var thisIsMyCopy = '<p>copy copy copy <strong>strong copy</strong></p>';

并像这样将它插入到 react 中，并让它工作？

render: function() {
    return (
        <div className="content">{thisIsMyCopy}</div>
    );
}

并让它按预期插入 HTML？我还没有看到或听说过任何关于可以内联执行此操作的 react 函数，或解析可以使其工作的事物的方法。

Answer 1

您可以使用 dangerouslySetInnerHTML ，例如

render: function() {
    return (
        <div className="content" dangerouslySetInnerHTML={{__html: thisIsMyCopy}}></div>
    );
}