循环解析富文本

素颜马尾好姑娘i 2022-04-17 06:35 190阅读 0赞

碰到了需要循环解析的富文本，但是网上很多都是单个文本解析，总算在网上找到了类似的方法。

借鉴：[https://blog.csdn.net/Colt666/article/details/82220191?tdsourcetag=s\_pctim\_aiomsg][https_blog.csdn.net_Colt666_article_details_82220191_tdsourcetag_s_pctim_aiomsg]

其他代码就不带了  只是写一个核心代码

<view  wx:for="{
       {xlist}}" class='cmain'>
        <view class='clist fs26' data-index="{
       {index}}" bindtap='godet'>
          <view>{
       {item.title}}</view>
           <view class='f-r '> 
            {
       {item.show==true?"收起":"详情"}}
           <view class='cimg {
       {item.show==true?"xz180":""}}'>
            <image mode='aspectFill' src='../../icon/xia.png'></image>
           </view>
           </view>
        </view>
        <view class='ctext {
       {item.show == true ?"show":"hide"}}'>
            <view class='t-main fs28'>
             <view>:{
       {item.number}} </view>
              <view>：{
       {item.create_time}} </view>
              <view> {
       {item.finish_time}}</view>
              <view> {
       {item.expect_time}}</view>
              <view>{
       {item.user}} </view>
              <view>{
       {item.mobile}} </view>
              <view>{
       {item.party}}</view>
              <view>项目说明： 
    
    
    
    
               <block  wx:if="{
       {index == itemsindex}}"  wx:for="{
       {list}}" wx:for-item="items" wx:for-index="itemsindex">
                <template is="wxParse" data="{
       {wxParseData:items}}"/>
           
               </block>
            </view>
            </view> 
    
          </view>
          </view>
    
        </view>
      </view>

req.getxlist({
          access_token: app.accessToken(),
          search: "",
          page: 1,
        }).then((res) => {
          console.log("项目列表返回", res);
          wx.hideLoading();
            if (res.code == 1) {
              let rlist = res.data[0].list;
              let xh5list = [];
                      for (let i = 0; i < rlist.length; i++) {
                rlist[i].create_time = app.gettime(rlist[i].create_time * 1000);
                rlist[i].expect_time = app.gettime(rlist[i].expect_time * 1000);
                rlist[i].finish_time = app.gettime(rlist[i].finish_time * 1000);
                rlist[i].show = false;
     //大致步骤   rlist[i].content就是返回的h5格式的代码
    //先确保content有值，不然解析会报错 直接加上空格就行了。
                if (!rlist[i].content){
                rlist[i].content = " ";
                }
    //将content push到一个临时数组
                xh5list.push(rlist[i].content);
              }
              console.log("xh5list",xh5list);
    //然后开始解析
              for (let i = 0; i < xh5list.length; i++) {
                wxParse.wxParse('content'+ i, 'html', xh5list[i], that); 
                if (i === xh5list.length - 1) {
    //最后添加到list数组 ，这个list不用去定义，可以在wxml直接使用
                 wxParse.wxParseTemArray('list', 'content', xh5list.length, that)
    
                }
    
               
              }
             
              that.setData({
                xlist: res.data[0].list,
              })
    
            } else {
              wx.showToast({
                title: res.message,
                icon: 'none'
              })
            }
          })
          .catch((err) => {
            console.log(err);
            app.errfun();
          });

自此，解析成功，一开始我试过 在 <template is="wxParse" data="\{ \{wxParseData:items\}\}"/>下功夫

将wxParseData:items 变成动态的  写成<template is="wxParse" data="\{ \{item.content\}\}"/>，无脑报错，

如果有正确的写法，可以评论。或者加好友互相讨论。

[https_blog.csdn.net_Colt666_article_details_82220191_tdsourcetag_s_pctim_aiomsg]: https://blog.csdn.net/Colt666/article/details/82220191?tdsourcetag=s_pctim_aiomsg