小程序解析html标签wxPrase插件

微信小程序的标签和原来我们习惯用的标签是不一样的,例如视图容器标签小程序是view,然而html就很多比如常用的div就和小程序的view类似。

通常我们在开发小程序(从列表页跳转到详情页)通过富文本编辑器返回的数据一般都是html的标签。然而小程序又不能识别这些标签。

下面为大家推荐一个很好的插件wxPrase。

github地址:https://github.com/icindy/wxParse   直接下载wxPrase文件夹。

具体使用方法:

1.导入下载好的wxPrase文件在项目中(直接复制便是);

2.在相应的详情XXX.wxml 文件中引入wxParse.wxml (引入文件最好放在第一行);

例如:

3..在相应的详情XXX.wxss文件中引入wxParse.wxss (引入文件最好放在第一行);

例如:@import "../../wxParse/wxParse.wxss";

4:在相应的详情XXX.js里的onLoad()方法里面写上:

WxParse.wxParse('content', 'html', content, that,5):

content:第一个参数表示绑定的数据(必填);

html:第二个参数被转换的是html(必填);

content:请求回来的数据(必填);

that:一般为this,指的就是js里的page对象,如果没有var that=this,这是一个必填项就是this(必填);

5:最后一个参数为imagePadding为当图片自适应是左右的单一padding(默认为0,可选)

例如

success: function (res) {

var data = res.data;

that.setData({

title: data[0].title,

source: data[0].copy_from,

time: data[0].posttime,

pic: data[0].picurl,

detiel:WxParse.wxParse('detiel', 'html',data[0].content, that, 5)

}

5:页面的模版引用;

例如:

这里的

detiel页面要用的数据detiel。

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 137,150评论 19 139
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,332评论 1 92
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 180,325评论 25 708
  • 上帝是神圣和权威者,上帝无所不知,无所不晓,也无所不能,上帝是至高无上的,永恒的。我们芸芸众生都是上帝之子,站在上...
    尚恩妈妈阅读 501评论 4 2
  • 我很努力地种树 ——年计划 我很努力地浇灌 ——周计划 我很努力地捉虫 ——日计划 一树林子的树,还未茁壮 遇了“...
    元元阅读 304评论 0 1

友情链接更多精彩内容