关于微信小程序的数组归类及遍历

数组归类

将相同字段的数组归为一类，可以用CSS自带的函数forEach（）
forEach() 方法用于调用数组的每个元素，并将元素传递给回调函数。

不推荐写法

调用

let resultDataDeal = dataDeal(curData);

dataDeal(data){
    let listArr = [];
    data.forEach(function(value,index){
      let obj = [];
      for(let i=0;i<listArr.length;i++){
        // 对比相同的字段key，相同放入对应的数组
        if(listArr[i][0].userName == value.userName){
          listArr[i].push(value);
          return;
        }
      }
      // 第一次对比没有参照，放入参照
      obj.push(value);
      listArr.push(obj);
 
    });
    return listArr;
};
 

推荐写法

调用

let resultDataDeal = dataDeal(curData);

dataDeal(data) {
  let listArr = [];
  data.forEach(function(value,index){
    let obj = [];
    for(let i=0;i<listArr.length;i++){
      // 对比相同的字段key，相同放入对应的数组，第一次字段值不存在，不可能进入if，往下面走
      if(listArr[i].classid == value.classid){
        listArr[i].listInfo.push({
          content: value.content,
          deadtime: value.deadtime
        })
        return;
      }
    }
    // 第一次对比没有参照，放入参照
    // obj.push(value);
    listArr.push(({
      classid: value.classid,
      listInfo: [{
        content: value.content,
        deadtime: value.deadtime
      }]
    }));
  });
  return listArr;
},

双层数组遍历

关于上述推荐与不推荐写法

不推荐写法是因为 在个人尝试下，在wxml没有可能打印出双层数组（不知道是设定还是什么，反正各种发发都试过了还是不行，最后只好改写函数）

推荐写法是因为方便打印

双层遍历数组打印（利用wx:for-item='array’自己设定item名称方便第二层打印）

<view>
  <block wx:for="{{homework}}" wx:key="id"  >
  <text>{{item.classid}}</text>
     <view wx:for="{{item.listInfo}}" wx:for-item='array' wx:key='ID'>
        <text>{{array.content}}</text>
        <text>{{array.deadtime}}</text>
     </view>
  </block>
</view>

最后结果 成功实现按班级分类