同款下载

微信小程序富文本解析wxParse下载支持html标签


小程序默认不支持富文本,需要正常展示如正文、图片就需要调用插件wxParse,原下载地址在GitHub,如果不翻墙反应速度十分慢。因此,在这里提供一个下载包(未进行任何增删)。
image.png

下载完之后我们需要用到目录下的wxParse文件夹,把他拷贝到我们的项目目录下
 

引入wxParse相关文件

1、在app.wxss全局样式文件中,需要引入wxParse的样式表

 @import "../../wxParse/wxParse.wxss";

2、在需要加载html内容的页面对应的js文件里引入wxParse

 var wxParse = require('../../wxParse/wxParse.js');

通过调用WxParse.wxParse方法来设置html内容
* WxParse.wxParse(bindName , type, data, target,imagePadding)
* 1.bindName绑定的数据名(必填)
* 2.type可以为html或者md(必填)
* 3.data为传入的具体数据(必填)
* 4.target为Page对象,一般为this(必填)
* 5.imagePadding为当图片自适应是左右的单一padding(默认为0,可选)
 

修改index.js

index.js数据渲染页加入wxParse

注意:此处代码仅供辅助理解,全部复制必然报错。请注意甄别提取核心源码wxParse.wxParse与适配

Page({
data: {
},
onLoad: function () {
var that = this;
wx.request({
url: '', 
method: 'POST',
data: {
'id':13
},
header: {
'content-type': 'application/json'
},
success: function(res) {
me.setData({
row:ret.data.row
})
wxParse.wxParse('article', 'html', ret.data.row.newstext, me,5);
}
})
}
})
//不同小程序接口写法差异较大,请注意甄别提取核心源码wxParse.wxParse与适配

正文调用调整

在页面中使用下面的模板替换正文字段{{正文字段}}

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

这样就可以在微信小程序中嵌入html内容了

下载说明:

1、本站资源都是白菜价出售,同样的东西,我们不卖几百,也不卖几十,甚至才卖几块钱,一个永久会员能下载全站100%源码了,所以单独购买也好,会员也好均不提供相关技术服务。

2、如果源码下载地址失效请/联系站长QQ进行补发。

3、本站所有资源仅用于学习及研究使用,请必须在24小时内删除所下载资源,切勿用于商业用途,否则由此引发的法律纠纷及连带责任本站和发布者概不承担。资源除标明原创外均来自网络整理,版权归原作者或本站特约原创作者所有,如侵犯到您权益请联系本站删除!

4、本站站内提供的所有可下载资源(软件等等)本站保证未做任何负面改动(不包含修复bug和完善功能等正面优化或二次开发);但本网站不能保证资源的准确性、安全性和完整性,用户下载后自行斟酌,我们以交流学习为目的,并不是所有的源码都100%无错或无bug;同时本站用户必须明白,【源码源码ui网】对提供下载的软件等不拥有任何权利(本站原创和特约原创作者除外),其版权归该资源的合法拥有者所有。

5、请您认真阅读上述内容,购买即以为着您同意上述内容。

一保站 » 微信小程序富文本解析wxParse下载支持html标签