微信小程序wxParse使用说明
生活随笔
收集整理的這篇文章主要介紹了
微信小程序wxParse使用说明
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
最近在做一個(gè)微信小程序項(xiàng),遇到了文章的詳情頁(yè)面是富文本的情況,內(nèi)容是通過(guò)接口讀取的服務(wù)器中的富文本內(nèi)容,是html格式的,小程序默認(rèn)是不支持html格式的內(nèi)容顯示的,那我們需要顯示html內(nèi)容的時(shí)候,就可以通過(guò)wxParse來(lái)實(shí)現(xiàn)。
wxParse官方下載地址:https://github.com/icindy/wxParse
使用方法:
一,下載完之后我們需要用到此目錄下的wxParse文件夾,把他拷貝到我們小程序項(xiàng)目的根目錄下:
二,配置文件
首先在xx.wxml導(dǎo)入文件,在文件頭寫(xiě)上:
然后再wxss導(dǎo)入文件,在文件頭寫(xiě)上:
@import "../../wxParse/wxParse.wxss";三,在頁(yè)面xx.js里面寫(xiě)上:
var WxParse = require('../../wxParse/wxParse.js');onLoad: function (options) {var that_ = this;wx.request({url: '',headers:{'Content-Type':'application/json'},success:function(rsp){that_.setData({'art': rsp.data})// rsp.data.body 富文本內(nèi)容var content_ = rsp.data.body;WxParse.wxParse('content_', 'html', content_ , that_, 0);}})}四,在頁(yè)面中引用模板
<import src='../../wxParse/wxParse.wxml'/> <template is="wxParse" data="{{wxParseData:content_.nodes}}" />//這里data中content_為bindName這樣就可以在微信小程序中嵌入html內(nèi)容啦~
此方法的含義為:
- WxParse.wxParse(bindName , type, data, target,imagePadding)
- 1.bindName綁定的數(shù)據(jù)名(必填)
- 2.type可以為html或者md(必填)
- 3.data為傳入的具體數(shù)據(jù)(必填)
- 4.target為Page對(duì)象,一般為this(必填)
- 5.imagePadding為當(dāng)圖片自適應(yīng)是左右的單一padding(默認(rèn)為0,可選)
總結(jié)
以上是生活随笔為你收集整理的微信小程序wxParse使用说明的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: Samba远程代码执行漏洞(CVE-20
- 下一篇: git原理浅析及命令介绍