javascript - ReactJS 如何在字符串中呈现 HTML 对象跨度元素

Question

如何将字符串中包含 span 元素的 HTML 对象转换为 Reactjs 实际可以呈现为 HTML 的内容？

澄清一下，这是我所拥有的:

let myObject = "apple tree"

我写了一个函数，将 apple 这个词包装在一个 span 标签(html 对象)中

<span style="color: red;">apple</span>tree

我的网站显示:

[object Object] tree

但它应该显示

apple tree

其中“apple”是红色的，因为它被包裹在一个 span 中

我像这样将字符串传递到我的组件中:

return (<div>{myObject}</div>)

不确定如何将这个对象呈现为实际的 HTML 元素，也不确定我这样做是否危险 SetInnerHTML 也是最好的也是唯一的选择

Answer 1

这个怎么样？

{<span style="color: red;">{'apple'}</span>tree}

让我知道它是否有效。