从json返回dom元素

Returning dom element from json

本文关键字:元素 dom 返回 json      更新时间:2023-09-26

我有一个这样的JSON:

{
  "HOME_VIEW_CONTENT": {
    "header": "<div>Hello <span className='someClass'>world!</span></div>",
    "ingress": "Hello moon!"
  }
}

然后在react中我有这个代码:

{content.header}
{content.ingress}

这工作,但我得到的div作为一个字符串(自然)。是否有一个插件或一个简单的方法来转换字符串与div到一个div对象,而不使用危险的insertinnerhtml在反应?

我正在使用webpack + react设置,所以我可能会使用加载器?或者是否有一种反应方法来做到这一点?

React转义HTML以防止XSS。如果你真的想渲染HTML,你可以使用危险的setinnerhtml:

dangerouslySetInnerHTML={{__html: this.state.actions}}

React有这种语法,这样你就不会意外地将文本呈现为HTML并引入XSS错误。

这是来自文档,我还没有测试这个,因为我不需要它到目前为止。