微信小程序富文本插件WxParse使用

微信小程序富文本插件WxParse使用

微信小程序可以用前端的来实现的但是,有的情况可能需要微信小程序和前端的其他项目保持一致,一些富文本内容或者接口返回的是html格式的数据或者是md格式的数据这就需要用到微信小程序的富文本插件了
这就需要用到wxParse这个小程序插件了

下载地址

github下载地址
在这里插入图片描述
到达github后直接在里面找到此文件就ok了,这就是我们需要的文件

开始使用

1、将文件直接放到微信小程序的项目包中
2、使用在页面中使用的时候,将文件引入

//在需要的页面中引入样式
//需要用到的页面中的wxss中
@import "../../wxParse/wxParse.wxss";
//需要用到的页面中的js中
let WxParse = require('../../wxParse/wxParse.js');
//也可以直接在app.wxss中直接引入

3、使用在相应的页面使用的时候先给一个展示的盒子

	//此处data="{{wxParseData:articlea.nodes}}" 中的articlea是你在后台js中配置的名字
	<import src="../../wxParse/wxParse.wxml" />
    <template is="wxParse" data="{{wxParseData:articlea.nodes}}" />

对应的js中

//此处的article和页面中调用的时候名字一直
WxParse.wxParse('article', 'html', data.Description, that, 0);
//此处所传参数的意思
/**
* WxParse.wxParse(bindName , type, data, target,imagePadding)
* 1.bindName绑定的数据名(必填)
* 2.type可以为html或者md(必填)
* 3.data为传入的具体数据(必填)
* 4.target为Page对象,一般为this(必填,注意wx中嵌套过深的时候自定义this)
* 5.imagePadding为当图片自适应是左右的单一padding(默认为0,可选)
*/

一个页面多处用到的时候需要这样调用
在这里插入图片描述
在wxparse中的源码中可以看看他是使用什么样的方式来实现
在这里插入图片描述
使用的正是我们微信小程序中定义工具的方法实现的
所以能看到这里的朋友你可以花费点空闲的时间看看源码

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值