微信小程序text标签-微信小程序解析富文本的几种方法-小程序标签-即速应用

微信小程序text标签-微信小程序解析富文本的几种方法-小程序标签

浏览量：4617 时间：2020-03-20 来源：晏金煜

1.工作中有遇到过在小程序中需要解析后台管理系统设置的富文本内容，
2.一，可以使用wxParse插件解析html
3.使用方法
4.1.在github中下载下载地址https://github.com/icindy/wxParse/tree/master/wxParse
5.
6.2.下载后复制到自己的小程序项目中
7.
8.3.设置全局样式
/**app.wxss**/@import"./wxParse/wxParse.wxss";
9.4.在需要调用插件的页面中引入js
10.
//pages/about/about.jsvarWxParse=require('../../wxParse/wxParse.js
11.4.使用方法，直接在方法中使用就可以了
//pages/about/about.jsonLoad:function(options){constthat=this;/***WxParse.wxParse(bindName,type,data,target,imagePadding)*1.bindName绑定的数据名(必填)*2.type可以为html或者md(必填)*3.data为传入的具体数据(必填)*4.target为Page对象,一般为this(必填)*5.imagePadding为当图片自适应是左右的单一padding(默认为0,可选)*/vartemp=WxParse.wxParse('article','html',data,that,5);},
12.5.最后
13.
!--pages/about/about.wxml--importsrc="../../wxParse/wxParse.wxml"/viewclass="content"!--这一块是富文本显示的内容区--templateis="wxParse"data="{{wxParseData:article.nodes}}"/
14./view
15.二，可以使用小程序自带的富文本组件
16.基本使用方法
17.1.在rich-text.wxml页面中使用rech-text标签
!--rich-text.wxml--rich-textnodes="{{nodes}}"/rich-text
18.2.在rich-text.js页面中使用绑定数据
//rich-text.jsPage({/***页面的初始数据*/data:{nodes:''},/***生命周期函数--监听页面加载*/onLoad:function(options){constthat=this;letdata='divh3javascript-emjs同步编程/em与异步编程的区别,异步有哪些优点,为什么.../h3divspan2016年5月20日-/span从编程方式来讲当然是em同步编程/em的方式更为简单,但是同步有其局限性一是假如是单线程那么一旦遇到阻塞调用,会造成整个线程阻塞,导致cpu无法得到有效利用.../divdivdiv/divspanspan/span/span-百度快照/divdivspan为您推荐：/spanjs同步和异步ajax异步和同步的区别/div/div';that.setData({nodes:data})},})效果