美文网首页
小程序解析html标签wxPrase插件

小程序解析html标签wxPrase插件

作者: JamHsiao_aaa4 | 来源:发表于2018-03-02 14:14 被阅读0次

    微信小程序的标签和原来我们习惯用的标签是不一样的,例如视图容器标签小程序是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。

    相关文章

      网友评论

          本文标题:小程序解析html标签wxPrase插件

          本文链接:https://www.haomeiwen.com/subject/ksefbxtx.html