微信小程序使用wxParse解析html的方法示例
本文實(shí)例講述了微信小程序使用wxParse解析html的方法。分享給大家供大家參考,具體如下:
首先去 https://github.com/icindy/wxParse 下載wxParse,只拷貝wxParse文件夾即可。
或者點(diǎn)擊此處本站下載。
一、首先將插件文件夾復(fù)制到項(xiàng)目里面

二、導(dǎo)入文件
首先在xx.wxml導(dǎo)入文件,在文件頭寫上:
<import src="../../wxParse/wxParse.wxml"/>
然后再wxss導(dǎo)入文件,在文件頭寫上:
@import "../../wxParse/wxParse.wxss";
三、在頁(yè)面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對(duì)象,一般為this(必填)
* 5.imagePadding為當(dāng)圖片自適應(yīng)是左右的單一padding(默認(rèn)為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)
})
希望本文所述對(duì)大家微信小程序開發(fā)有所幫助。
相關(guān)文章
原生js實(shí)現(xiàn)改變隨意改變div屬性style的名稱和值的結(jié)果
在本文將為大家介紹下如何用原生js和jQuery實(shí)現(xiàn)隨意改變div屬性,和重置,具體實(shí)現(xiàn)如下,感興趣的朋友可以參考下,希望對(duì)大家有所幫助2013-09-09
解讀TypeScript與JavaScript的區(qū)別
這篇文章主要介紹了TypeScript與JavaScript的區(qū)別及說(shuō)明,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-12-12
JS實(shí)現(xiàn)Excel導(dǎo)出功能以及導(dǎo)出亂碼問題解決詳解
這篇文章主要為大家詳細(xì)介紹了JavaScript如何調(diào)用后臺(tái)接口實(shí)現(xiàn)Excel導(dǎo)出功能以及導(dǎo)出亂碼問題的解決辦法,需要的小伙伴可以參考一下2023-07-07
原生js實(shí)現(xiàn)可愛糖果數(shù)字時(shí)間特效
本文主要介紹了原生js實(shí)現(xiàn)可愛糖果數(shù)字時(shí)間特效的實(shí)例代碼,附效果展示和代碼演示。具有一定的參考價(jià)值,下面跟著小編一起來(lái)看下吧2016-12-12
element?UI中在?el-select?與?el-tree?結(jié)合組件實(shí)現(xiàn)過(guò)程
項(xiàng)目上實(shí)現(xiàn)某個(gè)功能,使用到了?el-select?和?el-tree?組合實(shí)現(xiàn),記錄下兩者結(jié)合的實(shí)現(xiàn)過(guò)程,對(duì)?el-select?與?el-tree?結(jié)合組件實(shí)現(xiàn)過(guò)程感興趣的朋友跟隨小編一起看看吧2023-02-02
細(xì)說(shuō)JS數(shù)組遍歷的一些細(xì)節(jié)及實(shí)現(xiàn)
本文主要介紹了細(xì)說(shuō)JS數(shù)組遍歷的一些細(xì)節(jié)及實(shí)現(xiàn),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2023-05-05
JavaScript之Map和Set_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
這篇文章主要為大家詳細(xì)介紹了JavaScript之Map和Set的相關(guān)資料,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-06-06

