美文网首页小程序
微信小程序富文本解析wxParse的使用

微信小程序富文本解析wxParse的使用

作者: 程序员三千_ | 来源:发表于2019-04-09 15:50 被阅读50次

    首先我们在github上下载wxParse

    下载链接:wxParse

    下载完之后我们需要用到目录下的wxParse文件夹,把他拷贝到我们的项目目录下

    下面是具体使用步骤:

    1.在app.wxss全局样式文件中,需要引入wxParse的样式表

    ```

    @import"/page/wxParse/wxParse.wxss";  

    ```

    2.在需要加载html内容的页面对应的js文件里引入wxParse

      ```

      varWxParse =require('../../wxParse/wxParse.js');

    ```

    3.通过调用WxParse.wxParse方法来设置html内容

    4.在页面中引用模板

    记录微信小程序解析富文本碰到的问题 :

    1.IOS端富文本滑动不流畅的问题

    根本问题是富文本展示区域的滚动条跟整体页面的滚动条有一定冲突,导致滚动条不流畅;

    解决办法

        wxParse.wxss中有如下代码

    ```    

    view{word-break: break-all;overflow: auto;}   

    ```

    修改为:

    ```

        .detailview{word-break: break-all;height: auto;overflow: hidden;}

    ```

        detial为wxParse解析模板的父节点

    2. 安卓手机,解析出现错误

    错误信息,console.dir is not a function

    是因为在html2json.js文件中有console.dir的方法在安卓中不兼容,将其修改为console.log即可

    相关文章

      网友评论

        本文标题:微信小程序富文本解析wxParse的使用

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