小程序中加载富文本有三种方式:
1、rich-text:rich-text解析富文本的难点在于怎么把html/html5转换成符合小程序要求的nodes
2、wxParse:功能据说很强大
3、web-view:web-view官方文档中介绍的src,接收的是网页链接,对于富文本的加载可能就行不通了吧,我没搞过,不太清楚
所以还是记录一下wxParse吧
下载wxParse文件
git地址:https://github.com/icindy/wxParse
将此文件放在你的工程里,在你想引用的js和wxml文件中,进行引用,注意你的路径
js文件:
var WxParse = require('../../../wxParse/wxParse.js');
wxml文件:
<import src="../../../wxParse/wxParse.wxml" />
然后在你得到网络请求数据那里,写上这句:WxParse.wxParse('detail','html',dataDic.data.PlayDesc,that,0);
/*
参数一:bindName - 跟wxml中绑定的数据,保持一致
参数二:type - 类型可以为html或md,必填
参数三:data - 你要加载的富文本数据,必填
参数四:target - 为Page对象,一般为this,必填
参数五:imagePadding - 为当图片自适应是左右的单一padding (默认为0,非必填)
*/
WxParse.wxParse('detail','html',dataDic.data.PlayDesc,that,0);
wxml中
<scroll-view style="height:{{storyHeight}}px;" scroll-y="true" >
<template is="wxParse" data="{{wxParseData:detail.nodes}}"/>
</scroll-view>
以上就是加载富文本的过程,不过项目中的富文本,还有点击链接事件,用wxParse暂时点击不了,还不清楚要怎么解决,等我找到方法再来分享