小程序从数组从循环取数据，将符合条件的数据显示出来，并且显示数量不能超过3条

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/hhy2014yatan/article/details/82255613

问题描述：小程序从数组从循环取数据，将符合条件的数据显示出来，并且控制在首页的显示数量不超过3条

wxml:

 <text wx:for="{{product_nav}}" data-idx="{{index}}" class="item {{currentTab==index ? 'active' : ''}}"
     wx:key="unique" bindtap="navbar_product">{{item}}</text> 

并在要显示的内容处加上:<view class=" {{item.isShow?'show':'hide'}}"></view>

js:

 navbar_product: function (e) {
   this.setData({
      currentTab: e.currentTarget.dataset.idx,
      
    })
     this.showList(e);
  },
  showList: function (e) {
    let i = 0;
    let a = 0;
    let arrayItem = this.data.productItems;//获取循环数组对象
    for (let item of arrayItem) {
      if (item.typeId == e.currentTarget.dataset.idx) {
        if (a<3) {
          arrayItem[i].isShow = "true"
          a++;
        } else {
          arrayItem[i].isShow = ""
          break;
        }
      }
      i++;
    }
    this.setData({
      productItems: arrayItem
    })
  }

wxss:

.show{
  display: block;
}
.hide{
  display: none;
}