前端各框架怎么解析html字符串

1. vue

let htmlMsg = '<p>这是一段html字符串p>'
<div v-html="htmlMsg">div>

2. 微信小程序

在js中定义:
msg:'<p style="color:red">红色的字p>'
在wxml中取值,使用rich-text
<rich-text nodes="{{msg}}">rich-text>

另外,如果后台返回的数据中有换行符,可以通过JSON.stringify查看,应该会显示/n,如果想在代码中实现换行的效果,用 标签即可正确解析换行符及空格
3. react
使用dangerouslySetInnerHTML属性

const msg='<p style="color:red">红色的字p>'
<div dangerouslySetInnerHTML={{__html:msg}}>div>
这里要注意,这个div只能放这个html解析的内容,不能再在div里写别的内容,否则会报错

你可能感兴趣的:(vue,react)