微信小程序插件wxParse的使用

由于微信小程序不支持后台富文本编辑器编辑的html，需要使用wxParse 这个插件来解析，下面介绍一下这个插件的使用方法。

1. 下载插件

在GigHub上面找到插件Demo，地址为 https://github.com/icindy/wxParse，把Demo里面的wxParse目录拷贝到项目里面.

2. 在当前页面的JS里引入wxParse.js

var WxParse = require('../../wxParse/wxParse.js');
Page({data: {},onLoad: function() {var that = this;// 映射表情包WxParse.emojisInit('[]', "/wxParse/emojis/", {"00": "00.gif","01": "01.gif","02": "02.gif","03": "03.gif","04": "04.gif","05": "05.gif","06": "06.gif","07": "07.gif","08": "08.gif","09": "09.gif","09": "09.gif","10": "10.gif","11": "11.gif","12": "12.gif","13": "13.gif","14": "14.gif","15": "15.gif","16": "16.gif","17": "17.gif","18": "18.gif","19": "19.gif",});var article = `<div>从后端获取的HTML格式文件</div>`;WxParse.wxParse('article', 'html', article, that, 5);// WxParse.wxParse(bindName, type, data, target, imagePadding);// bindName绑定的数据名(必填)// type可以为html或者md(必填)// data为传入的具体数据(必填)// target为Page对象, 一般为this(必填)// imagePadding为当图片自适应是左右的单一padding(默认为0, 可选)}})

3. 在全局app.wxss引入wxParse.wxss

@import "wxParse/wxParse.wxss";

4. 在当前页面wxml中引入wxParse.wxml

<import src="../../wxParse/wxParse.wxml"/> <view class="wxParse"><!-- 这里data中article为bindName --><template is="wxParse" data="{{wxParseData:article.nodes}}"/>
</view>

微信小程序插件wxParse的使用相关推荐

微信小程序使用wxparse插件，渲染文章不换行问题
微信小程序使用wxParse插件渲染富文本内容,不换行显示,影响阅读,我的解决方法:在wxParse.wxss中加上如下样式:(在我的小程序里面是有效的) view{/* word-break:bre ...
微信小程序 html插件,微信小程序使用wxParse插件读取富文本,解析html标记
微信小程序使用wxParse插件读取富文本,解析html标记发布时间:2018-04-07 作者:Admin 标签: 微信小程序微信小程序解析HTML标记访问量:1203 使用wxParse可以 ...
wxparse的使用php返回数组输出,微信小程序中WxParse循环解析返回的富文本数据
WxParse循环解析一.遇到问题最近在做小程序,遇到这样一个需求: 将百度的Ueditor编辑器存入的文本数据显示在小程序中,需要保留之前的样式,这就用到了 WxParse插件,它能够用解析ht ...
微信小程序插件功能页开发详细流程
有问题可以扫码加我微信,有偿解决问题.承接小程序开发. 微信小程序开发交流qq群 173683895 . 526474645 : 正文: 关于新出的微信小程序插件功能页做一下记录,希望能帮到大 ...
微信小程序使用wxParse，解决图片显示路径问题
微信小程序使用wxParse,解决图片显示路径问题参考文章: (1)微信小程序使用wxParse,解决图片显示路径问题 (2)https://www.cnblogs.com/zxf100/p/100 ...
微信小程序插件---表单验证篇
微信小程序插件---表单验证篇项目下载地址 WxValidate - 表单验证插件介绍该插件是参考 jQuery Validate 封装的,为小程序表单提供了一套常用的验证规则,包括手机号码.电 ...
从原理到应用，一文带你了解微信小程序插件能力
3月13日,微信小程序插件功能上线:8月底,在时隔半年后,为进一步推广插件功能,微信在开发者社区上线了插件版块. 小程序插件是可以被开发者添加到小程序内直接使用的,能为用户提供具体服务的功能组件-- ...
微信小程序使用wxparse，显示图片的相对路径问题
微信小程序使用wxparse,有一个问题,就是我们在网页后台编辑器里面的图片如果上传的时候采用了相对路径,在wxparse里就不能正常显示,但是,如果在编辑器里直接上传成绝对的网络地址路径之后,如果万 ...
「腾讯地图」微信小程序插件：提供简单的路线多方案规划服务
上期,我们在<「腾讯视频」微信小程序插件介绍>一文中介绍了「腾讯视频」小程序插件的意义.使用场景以及使用方法. 今天我们会与大家分享一款同样优秀的小程序插件--「腾讯地图」插件,从使用场景 ...
微信小程序插件引入，地铁图插件、地图选点插件、地图选点插件
如果用微信小程序插件需要开发者秘钥:申请秘钥第一步:记住下面内容一定要写在app.json这个文件里 "plugins": {"subway": {" ...

微信小程序插件wxParse的使用

微信小程序插件wxParse的使用相关推荐

最新文章

热门文章