我在处理Facebook的ReactJS时遇到问题。每当我执行ajax并想要显示html数据时,ReactJS会将其显示为文本。 (请参见下图)
数据通过jQuery Ajax的成功回调函数显示。
$.ajax({
url: url here,
dataType: "json",
success: function(data) {
this.setState({
action: data.action
})
}.bind(this)
});
<< img src =“ https://image.soinside.com/eyJ1cmwiOiAiaHR0cHM6Ly9pLnN0YWNrLmltZ3VyLmNvbS81MlRxMS5wbmcifQ==” alt =“在此处输入图像描述”>“ >>
有没有简单的方法可以将其转换为html?我应该如何使用ReactJS?
我在处理Facebook的ReactJS时遇到问题。每当我执行ajax并想要显示html数据时,ReactJS会将其显示为文本。 (参见下图)通过成功显示数据...
默认情况下,React会转义HTML以防止XSS (Cross-site scripting)。如果您确实要呈现HTML,则可以使用dangerouslySetInnerHTML
属性:
现在有更安全的方法可以完成此操作。 <td dangerouslySetInnerHTML={{__html: this.state.actions}} />
使用这些方法。
我建议使用<div dangerouslySetInnerHTML={{__html: 'First · Second'}} />
创建的Interweave。它是一个了不起的库,它利用许多巧妙的技术来解析并安全地将HTML插入DOM。
我发现了这个js小提琴。像这样工作
您还可以使用html-react-parser中的Parser()。我用过一样的。 jsfiddle分享了。
我开始使用名为react-html-parser的npm包
npm i html-react-parser;