小程序——富文本


  在开发小程序的时候,会遇到接口返回的内容是html标签的情况,为了让把小程序不识别的html标签转成可识别的wxml,我们用到了富文本。

  使用方法:

    1:项目根目录下应用xwParse(下载地址:https://github.com/icindy/wxParse)。

    2:页面引用方式一:

      (1)js引入:

        var WxParse = require('../../wxParse/wxParse.js');

        WxParse.wxParse(bindName, type, data, target, imagePadding)

          bindName:绑定的数据名(必填)

          type:html或md(必填)

          data:传入的数据(必填)

          target:this(必填)

          imagePadding:图片自适应的左右padding(默认是0,可选)   

      (2)wxml引入:

        wxml:<import src="../../wxParse/wxParse.wxml" />

        <import src="../../wxParse/wxParse.wxml"/> <template is="wxParse" data="{{wxParseData:article.nodes}}"/>

    3:页面引入方式二:

      小程序自带rich-text组件(详细内容参看:https://developers.weixin.qq.com/miniprogram/dev/component/rich-text.html

      示例代码

        <rich-text nodes="{{nodes}}" bindtap="tap"></rich-text>      

        Page({         data: {         nodes: [{         name: 'div',         attrs: {         class: 'div_class',         style: 'line-height: 60px; color: red;'         },         children: [{         type: 'text',         text: 'Hello&nbsp;World!'         }]         }]         },         tap() {         console.log('tap')         }         })

      

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM