微信小程序中解析html代码片段,使用wxParse

使用wxParse插件进行转换

  • 下载链接 : 点这里.
  • 下载完后,复制wxParse这个文件夹,把这个文件夹放到自己小程序的utils里面

wxss

  • 首先在全局样式app.wxss里面引入wxParse的样式表
 @import "/page/wxParse/wxParse.wxss";

js

  • 在需要解析html页面的js文件引入wxParse.js
 var WxParse = require('../../wxParse/wxParse.js');
  • 使用方式
 /**
 * WxParse.wxParse(bindName , type, data, target,imagePadding)
 * 1.bindName绑定的数据名,对应wxml中引入的属性名(必填)
 * 2.type可以为html或者md, 我们这里是解析html所以填html(必填)
 * 3.data为传入的具体数据, 传入html片段字符串(必填)
 * 4.target为微信Page对象,一般为this(必填)
 * 5.imagePadding为当图片自适应是左右的单一padding(默认为0,可选)
 */
 
 onLoad: function(){.
   let html = '
您好
'; let that = this; wxParse.wxParse('name', 'html', html, that, 0); }

wxml

  • 引入wxParse.html
  • 使用自己在js定义的代码片段