小程序循环解析富文本数据

前言：数据是markdown编辑的内容，包含的都是带html的标签.。在循环里既想展示带html的数据，又不想影响其他字段数据。
一.使用wxParse（不推荐）

1. 下载放入到根目录文件夹下https://github.com/icindy/wxParse
   
2. 引入
   1.先在app.wxss里全局导入
   @import “/wxParse/wxParse.wxss”;
   2.在需要的模块对应的js文件里引入
   var WxParse = require(’…/…/wxParse/wxParse.js’)
   3.使用
   js里

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    var that = this;
    wx.request({
      url: 'https://xxx',
      success: function (res) {
        var data = res.data.data.list;
         // 就是下面这个for循环
        for (let i = 0; i < data.length; i++) {
          WxParse.wxParse('content_main' + i, 'html', data[i].content_main, that);
          if (i === data.length - 1) {
            WxParse.wxParseTemArray("WxParseListArr", 'content_main', data.length, that)
          }
        }

        that.setData({
          nbaInfos: data,
        });
      }
    });
  },

wxml里

<import src="../../wxParse/wxParse.wxml" />
<view class="nba-container">
  <block wx:key="{{index}}" wx:for="{{nbaInfos}}" >
    <view class="content">
      <view class="detail-container" data-id="{{item.id}}" catchtap="onDetailTap">
        <template is="wxParse" data="{{wxParseData:WxParseListArr[index]}}" />
        <text class="nba-title">{{item.modified_time}}</text>
      </view>
    </view>
  </block>
  </view>

效果：

二.rich-text标签(推荐)
https://developers.weixin.qq.com/miniprogram/dev/component/rich-text.html
不要任何插件，直接使用小程序官方文档里的标签

<view class="nba-container">
  <block wx:key="{{index}}" wx:for="{{nbaInfos}}" >
    <view class="content">
      <view class="detail-container" data-id="{{item.id}}" catchtap="onDetailTap">
        <rich-text nodes="{{ item.content_main }}"></rich-text>
        <text class="nba-title">{{item.modified_time}}</text>
      </view>
    </view>
  </block>

</view>

跟vue的v-html一样，非常方便简单