微信小程序渲染富文本(html标签)

最近遇到一个问题,后台管理系统传递过来的数据是富文本,也就是里面有html标签的字符串。怎么渲染到小程序页面呢。我是使用WxParse来渲染到小程序指定位置的。我们先下载WxParse文件。然后放在我们的项目中。

如果数据是单一的数据

先在wxml引入WxParse:

然后在js里面引入并配置:

因为后台里面的图片标签是img,而小程序是image,所以我就做了替换。

接下来在wxml要使用的地方直接使用就可以了:

这种数据是比较单一的,如果是数组我们还要进行处理;

假如返回的是这种类型的数据

lists就是data的数据

微信小程序渲染富文本(html标签)_第1张图片

在js这样处理了之后,在wxml这样写就可以了:

图片在IOS上滑动不流畅的解决方案;

wxParse.wxss中有如下代码:

view{

word-break:break-all; overflow:auto;

}

改为:

.detail view {

word-break: break-all;

height: auto;

overflow: hidden;

}

就可以了。

 

你可能感兴趣的:(微信小程序,小程序渲染html,小程序渲染富文本,小程序渲染html富文本)