微信小程序使用wxParse解析html的方法示例
更新時間:2019年01月17日 10:51:15 作者:黎成訶月
這篇文章主要介紹了微信小程序使用wxParse解析html的方法,結合實例形式詳細分析了wxParse的下載、導入及具體使用技巧,需要的朋友可以參考下
本文實例講述了微信小程序使用wxParse解析html的方法。分享給大家供大家參考,具體如下:
首先去 https://github.com/icindy/wxParse 下載wxParse,只拷貝wxParse文件夾即可。
或者點擊此處本站下載。
一、首先將插件文件夾復制到項目里面
二、導入文件
首先在xx.wxml導入文件,在文件頭寫上:
<import src="../../wxParse/wxParse.wxml"/>
然后再wxss導入文件,在文件頭寫上:
@import "../../wxParse/wxParse.wxss";
三、在頁面xx.js里的onLoad()
方法里面寫上:
var WxParse = require('../../wxParse/wxParse.js'); WxParse.wxParse('content', 'html', content, that,5)
此方法的含義為:
var article = '<div>我是HTML代碼</div>'; /** * WxParse.wxParse(bindName , type, data, target,imagePadding) * 1.bindName綁定的數(shù)據(jù)名(必填) * 2.type可以為html或者md(必填) * 3.data為傳入的具體數(shù)據(jù)(必填) * 4.target為Page對象,一般為this(必填) * 5.imagePadding為當圖片自適應是左右的單一padding(默認為0,可選) */ var that = this; WxParse.wxParse('article', 'html', article, that,5);
四、模板引用:
//這里data中content為bindName <template is="wxParse" data="{{wxParseData:content.nodes}}"/> 代碼示例: var list = "<div>55555555555555555</div>" var that=this that.setData({ content: WxParse.wxParse('content', 'html', list, that, 5) }) that.setData({ title: list[0].ari_name, // content: list[0].art_details, content: WxParse.wxParse('content', 'html', list[0].art_details, that, 5) })
希望本文所述對大家微信小程序開發(fā)有所幫助。
相關文章
談談encodeURI和encodeURIComponent以及escape的區(qū)別與應用
encodeURI和encodeURIComponent以及escape,這三個都是用來編碼的,本篇文章給大家介紹encodeURI和encodeURIComponent以及escape的區(qū)別與應用,感興趣的朋友一起學習吧2015-11-11改變文件域的樣式實現(xiàn)思路同時兼容ie、firefox
正如標題所言只是模擬了file文件域的外觀,其實起作用的還是文件域file,這樣就很方便,感興趣的朋友可以了解下2013-10-10