小程序解析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。