300字范文,内容丰富有趣,生活中的好帮手!
300字范文 > 如何在微信小程序中使用wxParser(富文本编辑器)

如何在微信小程序中使用wxParser(富文本编辑器)

时间:2023-08-29 08:55:11

相关推荐

如何在微信小程序中使用wxParser(富文本编辑器)

微信小程序想要展示一篇文章,有图片,有文字,内容是由pc端的富文本编辑器编辑好的,可以使用wxParser插件。

**1. 申请使用插件。**在「小程序管理后台 - 设置 - 第三方服务 - 插件管理」中查找插件名称「wxParser」(appid: wx9d4d4ffa781ff3ac),并申请使用。

2. 引入插件代码。version 表示目前插件版本为 0.2.1,provider 为该插件的 AppID,而 wxparserPlugin 为自定义的插件名称。

"plugins": {"wxparserPlugin": {"version": "0.2.1","provider": "wx9d4d4ffa781ff3ac"}}

在需要使用到该插件的小程序页面的 JSON 配置文件中,做如下配置:

{"usingComponents": {"wxparser": "plugin://wxparserPlugin/wxparser"}}

设置你的富文本内容,定义为richText

Page({data: {richText: '<h1>Hello world!</h1>'}})

然后在需要展示富文本内容的地方,使用「wxParser」组件,为 rich-text 属性赋值上你的富文本内容即可。

<wxparser rich-text="{{richText}}" />

同时,插件也提供了 bind:tapImg 和 bind:tapImg 两个监听事件用于点击图片和链接时的自定义处理,详细使用可参考插件的文档。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。