react给DOM提供的innerHTML
React里面也有与Vue里面的v-html类似的东西,就是dangerouslySetInnerHTML。dangerouslySetInnerHTML的作用:它是React为浏览器DOM提供的innerHTML的替换方案。通常来讲,使用代码直接设置HTML存在风险,因为很容易无意中使用用户暴露于跨站脚本(XSS)的攻击。因此,你可以直接在React中设置HTML,但当你想设置dang...
·
React里面也有与Vue里面的v-html类似的东西,就是dangerouslySetInnerHTML。
dangerouslySetInnerHTML的作用:
它是React为浏览器DOM提供的innerHTML的替换方案。
通常来讲,使用代码直接设置HTML存在风险,因为很容易无意中使用用户暴露于跨站脚本(XSS)的攻击。
因此,你可以直接在React中设置HTML,但当你想设置dangerouslySetInnerHTML时,需要向其传递包含key为 _html 的对象,依此来警示。
dangerouslySetInnerHTML的使用方法:
render() {
const val = `
测试第一行</br>
测试第二行</br>
测试第三行</br>
测试第四行</br>
`
return (
<div dangerouslySetInnerHTML={{__html: `<div>${val}</div>`}} />
)
}
此方法类似于vue的v-html。
PS:在开发过程中尽量少用。
更多推荐
已为社区贡献16条内容
所有评论(0)