小程序富文本转化插件

小程序的富文本显示问题一直是一个很大的问题

首先，他不允许之间在页面上用变量显示标签

比如说在后台

var str="<image src='123.jpg'></images>"
that.setData({
   data:str 
})

前端页面

{{data}}

 结果这样是显示不出来的，他会把这个当字符串处理，显示的还是

<image src='123.jpg'></images>

而不是我们需要的图片形式

我能想到的唯一办法就是把内容和图片用正则表达式截取出来。

截取出来了，那也就不能算是富文本了，因为只取了文字，加粗，字体颜色，我们都没办法弄

而且这样真的比较麻烦

 

今天在网上找到一个大神写的插件，比较牛，可以把html转换到微信小程序里面使用

虽然不能100%转化，但是绝大部分好像可以了

我们再用的时候用简单的标签就好了

 

网址是 https://github.com/icindy/wxParse

用法介绍上面也有，简要说一下

复制压缩包里面的wxParse文件夹

然后就是在页面中引入js和css文件

接下来，我们在需要显示的wxss页面加上 template标签

PS：有一点文档上没有说

模板的引用必须套上两层标签

<import src="../../wxParse/wxParse.wxml"/> 
<view class="wxParse">
    <template is="wxParse" data="{{wxParseData:txt.nodes}}"/>
</view>

 这样就能显示了