uni-app 解析后台接口返回的HTML


正常使用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;
},
})


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM