解决小程序多层循环导致页面加载缓慢问题

小程序多层循环嵌套导致加载慢

使用循环的时候有的需要多次循环列表找到最终需要的数据,但是会导致接口以及页面加载缓慢,此时建议将循环单独取出,并发触发循环,而不是循环完一个再循环下一个
正确实例

let obj = this.data.myDefaultCar;
      let setId = '';
      let arry1 = [];
      let arry2 = [];
      if (this.data.myDefaultCar) {
        this.setData({
          curClass: {
            gcName: obj.zichexi,
            scName: obj.brandName,
            gcId: ''
          },
        })
        let newList = this.data.carArr;
        newList.forEach(item => { // 循环使列表滑动指定位置
          let newObj = item.brands
          for (var k in newObj) {
              if (newObj[k].brandName === this.data.myDefaultCar.brandName) {
                this.setData({
                  toView: 'a_' + k,
                  setId: newObj[k].brandId,
                  arry1: item.brands
                })
                // console.log(k + '在数组中出现的位置为' + this.data.toView);
              }
          }
        });
        this.data.arry1.forEach(res => { // 循环使列表对应车型厂商展开
          if (res.brandId == this.data.setId) {
            res.childShow = !res.childShow;
          } else {
            res.childShow = true;
          }
          this.setData({
            carArr: newList,
            arry2: res.factoryList
          });
          return true;
        })
        this.data.arry2.forEach(respone => { // 循环出厂商id进行搜索类表
          if (respone.factoryName == this.data.myDefaultCar.zichexi) {
            this.setData({
              factoryid: respone.factoryid
            })
          }
        });
        this.getStoreGoods()
      }

错误实例

let obj = this.data.myDefaultCar
      let setId = ''
      if (this.data.myDefaultCar) {
        this.setData({
          curClass: {
            gcName: obj.zichexi,
            scName: obj.brandName,
            gcId: ''
          },
        })
        let newList = this.data.carArr;
        newList.forEach(item => {
          let newObj = item.brands
          for (var k in newObj) {
              if (newObj[k].brandName === this.data.myDefaultCar.brandName) {
                console.log('*****',newObj[k].brandId)
                this.setData({
                  toView: 'a_' + k,
                  setId: newObj[k].brandId
                })
                console.log(k + '在数组中出现的位置为' + this.data.toView);
              }
          }
          newObj.forEach(res => {
            if (res.brandId == this.data.setId) {
              res.childShow = !res.childShow;
            } else {
              res.childShow = true;
            }
            this.setData({
              carArr:newList
            });
            return true;
            if (res.brandName == this.data.myDefaultCar.brandName) {
              this.setData({
                CarParentId: res.brandId
              })
              res.factoryList.forEach(respone => {
                if (respone.factoryName == this.data.myDefaultCar.zichexi) {
                  this.setData({
                    factoryid: respone.factoryid
                  })
                }
              });
            }
          })
        });
        this.getStoreGoods()
      }

这两种加载速度有天壤之别,以后要注意了

你可能感兴趣的:(小程序开发,微信小程序,小程序总结)