小程序模板網(wǎng)

微信小程序使用wxParse實現(xiàn)接入富文本編輯

發(fā)布時間:2018-05-05 15:15 所屬欄目:小程序開發(fā)教程

簡介

微信小程序中比如活動說明,簡介這樣的圖文介紹說明頁面,后臺通常配置成富文本編輯框,由后臺直接輸入內(nèi)容,然后在小程序界面展現(xiàn)。

但是富文本編輯提取到內(nèi)容是html格式的,寫法與小程序的wxml并不一致,那么怎么樣才能做到富文本能夠在小程序頁面中顯示呢?

 

解決辦法

有位大牛開發(fā)了一個模板叫作wxParse,可以直接引入小程序使用。下面把大牛的github地址貼上來:

https://github.com/icindy/wxParse

 

想要了解更多的同學(xué)可以直接去他的github下查看說明文檔。

 

引入方式及使用方法

wxml文件代碼:

我的頁面結(jié)構(gòu),可以作為參考

下面是wxss頁面代碼,主要是引入wxParse.wxss,別的都是根據(jù)你自己頁面需要另外寫的。

下面是js代碼:

js部分要注意兩點:

第一點是在page函數(shù)之前引入wxParse

第二點是在獲取到html后執(zhí)行

WxParse.wxParse('article', 'html', that.data.article, that, 5)

其中的article就是獲取到的html代碼

 

小結(jié)

這類文章相信也有不少,我能學(xué)會使用既有同事幫忙,也自己查看了不少博客資料。這種組件的寫法還是老式的小程序?qū)懛ǎ〕绦蛐掳娴慕M件寫法已經(jīng)跟現(xiàn)在不一樣了,不知道這個插件的開發(fā)者以后會不會也轉(zhuǎn)換為最新的方式。總之,現(xiàn)在小程序還是支持這種寫法的。

如果有更好的實現(xiàn)方式,請一定要留下評論告知,謝謝。


 
 
 


易優(yōu)小程序(企業(yè)版)+靈活api+前后代碼開源 碼云倉庫:starfork
本文地址:http://22321a.com/wxmini/doc/course/24273.html 復(fù)制鏈接 如需定制請聯(lián)系易優(yōu)客服咨詢:800182392 點擊咨詢
QQ在線咨詢