小程序解析html標簽wxPrase插件

微信小程序的標簽和原來我們習慣用的標簽是不一樣的，例如視圖容器標簽小程序是view，然而html就很多比如常用的div就和小程序的view類似。

通常我們在開發小程序（從列表頁跳轉到詳情頁）通過富文本編輯器返回的數據一般都是html的標簽。然而小程序又不能識別這些標簽。

下面為大家推薦一個很好的插件wxPrase。

github地址：https://github.com/icindy/wxParse   直接下載wxPrase文件夾。

具體使用方法：

1.導入下載好的wxPrase文件在項目中（直接復制便是）；

2.在相應的詳情XXX.wxml 文件中引入wxParse.wxml (引入文件最好放在第一行)；

   例如：<import src="../../wxParse/wxParse.wxml"/> 

3..在相應的詳情XXX.wxss文件中引入wxParse.wxss (引入文件最好放在第一行)；

  例如：@import "../../wxParse/wxParse.wxss"; 

4：在相應的詳情XXX.js里的onLoad()方法里面寫上：

WxParse.wxParse('content', 'html', content, that,5):

        content：第一個參數表示綁定的數據（必填）；

        html：第二個參數被轉換的是html（必填）;

        content:請求回來的數據（必填）；

       that:一般為this，指的就是js里的page對象，如果沒有var that=this,這是一個必填項就是this（必填）;

       5:最后一個參數為imagePadding為當圖片自適應是左右的單一padding(默認為0,可選) 

例如

　　success: function (res) {
　　　　var data = res.data;
　　　　that.setData({
　　　　title: data[0].title,
　　　　source: data[0].copy_from,
　　　　time: data[0].posttime,
　　　　pic: data[0].picurl,
　　　　detiel:WxParse.wxParse('detiel', 'html',data[0].content, that, 5)
　　　}

5：頁面的模版引用；

例如：

<template is="wxParse" data="{{wxParseData:detiel.nodes}}"/>
這里的detiel頁面要用的數據detiel。