微信小程序中显示html富文本的方法

image.png

使用方法:
git地址:https://github.com/icindy/wxParse

一、下载wxParse文件
image.png
  • wxParse/
    -wxParse.js(必须存在)
    -html2json.js(必须存在)
    -htmlparser.js(必须存在)
    -showdown.js(必须存在)
    -wxDiscode.js(必须存在)
    -wxParse.wxml(必须存在)
    -wxParse.wxss(必须存在)
    -emojis(可选)
二、在要引入的页面的js文件中,引入文件

//在使用的View中引入WxParse模块
var WxParse = require('../../wxParse/wxParse.js');
//在使用的Wxss中引入WxParse.css,可以在app.wxss
@import "/wxParse/wxParse.wxss";

三、数据绑定

在page.js文件中绑定数据
如:

onLoad: function (options) {
var that = this;
var detail_content ="
我是HTML代码
"; WxParse.wxParse('detail_content', 'html', detail_content, that, 5); } //注意第一个参数需要与wxml中的一致

四、在page的wxml中引入模板