1. 程式人生 > >微信小程式使用wxParse解析html

微信小程式使用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.效果圖