正常使用rich-text是可以解决问题的,但是在支付宝小程序中不显示,在文档中看到“ 支付宝小程序 nodes 属性只支持使用 Array 类型。如果需要支持 HTML String,则需要自己将 HTML String转化为 nodes 数组,可使用 html-parser 转换。”这句话
结果OK
html:
<view class="article-content"> <rich-text :nodes="htmlNodes"></rich-text> </view> <!-- #ifdef MP-WEIXIN --> <ad v-if="htmlNodes.length > 0" unit-id="adunit-01b7a010bf53d74e"></ad> <!-- #endif -->
js:
引入:import htmlParser from '@/common/html-parser'
data(){
return {
htmlNodes: []
}
}
接口请求数据:
this.$request({ url: url, data: data, success: (res) => { console.log('0000',res.data.data) var htmlString = res.data.data.content.replace(/\\/g, "").replace(/<img/g, "<img style=\"display:none;\""); this.htmlNodes = htmlParser(htmlString); this.dataNotice = res.data.data; }, })
转载于:https://www.cnblogs.com/renxiao1218/p/11206829.html