微信小程序之富文本解析（wxParse）

分手后的思念是犯贱 2023-06-12 09:51 8阅读 0赞

github地址： [https://github.com/icindy/wxParse][https_github.com_icindy_wxParse]

下载wxParese文件，拷贝wxParse文件夹到自己的小程序项目中。

![format_png][]

2、在项目文件中使用  
（1）在需要使用的wxml文件中引入WxParse.wxml  
示例：

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

（2）在当前页对应的js中引入wxParse.js  
示例：

//index.js 
    const WxParse = require('../../wxParse/wxParse.js');

（3）使用template组件  
在刚刚引入的wxml中插入组件，具体插入的位置是需要转换的地方。  
示例:

<import src="../../wxParse/wxParse.wxml" />
    <view class="container">
      <view class='uinn'>
        <template is="wxParse" data="{
       {wxParseData:article.nodes}}" />
      </view>
    </view>

（4）在当前页的js中使用WxParse中的方法

//index.js
    const WxParse = require('../../wxParse/wxParse.js');
    Page({
      data: {
        
      }, 
      onLoad: function () {
        let that = this;
        let ceshi = 
        `<div>
                <span>请说出你喜欢的水果？</span>
                <ul>
                    <li>苹果</li>
                    <li>香蕉</li>
                    <li>橙子</li>
                </ul>
            </div>`;
        WxParse.wxParse('article', 'html', ceshi, that, 5); 
      }, 
    })

参数说明：

![format_png 1][]

[https_github.com_icindy_wxParse]: https://github.com/icindy/wxParse
[format_png]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy80MDQxMDc0LTVkMzAzMDM0OThhOWQ5MTUucG5n?x-oss-process=image/format,png
[format_png 1]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy80MDQxMDc0LWIwZDU1Zjc3ZDA3YmNlYzkucG5nP2ltYWdlTW9ncjIvYXV0by1vcmllbnQvc3RyaXB8aW1hZ2VWaWV3Mi8yL3cvODA0L2Zvcm1hdC93ZWJw?x-oss-process=image/format,png