微信小程序使用wxParse解析html

1.需要下载wxParse文件(点击即可下载)

2.添加到自己的工程内

    

3.引入wxss js wxml

     1.wxss引入

       

@import"../../lib/wxParse/wxParse.wxss";

2.js引入

var wxParse = require('../../lib/wxParse/wxParse.js');

3.wxml引入

  <!--商品详情开始-->
  <view class="detail">
    <import src="../../lib/wxParse/wxParse.wxml" />
    <template is="wxParse" data="{{wxParseData:goodsDetail.nodes}}" />
  </view>

4.参数解释使用

获取后台传过来的HTML代码 进行填充就OK
/**
* WxParse.wxParse(bindName , type, data, target,imagePadding)
* 1.bindName绑定的数据名(必填)
* 2.type可以为html或者md(必填)
* 3.data为传入的具体数据(必填)
* 4.target为Page对象,一般为this(必填)
* 5.imagePadding为当图片自适应是左右的单一padding(默认为0,可选)
*/
wxParse.wxParse('goodsDetail', 'html', that.data.goods.detail, that,0);

<!--商品详情开始-->
  <view class="detail">
    <import src="../../lib/wxParse/wxParse.wxml" />
    <template is="wxParse" data="{{wxParseData:goodsDetail.nodes}}" />
  </view>

5.效果图

猜你喜欢

转载自blog.csdn.net/yinlell/article/details/83892991