小程序如何避免setData的列表数据过大

按照分页的习惯,一般来说会把每一页请求的数据合并到上一次的数据中。就像这样

this.setData({
 categoryShopsList:this.data.categoryShopsList.concat(res.data.data.list)
})

对于小规模数据这样是非常方便快捷的。

那没问题来了,setdata官方建议的数据大小限制在1024kb,对于商品列表数据超过上千那种,最后concat在一起同时setdata 就会报错,数据量太大,影响内存消耗,渲染慢

这是需要避免和解决的问题

主要思想使用的是二维数组的方式去存储列表,

let Length = this.data.categoryShopsList.length;
that.setData({
    ['categoryShopsList[' + Length + ']']: res.data.data.list,
})

res.data.data.list 每一页请求过来的数据,存贮到对应的二维数组的对应的项中。

页面上上就需要两层遍历

<block wx:for="{{categoryShopsList}}" wx:for-item="listItem" wx:key="{{listItem}}">
     <view wx:for="{{listItem}}" wx:key="{{item}}" >
          ......................

这样每次在拿到下一页的数据时,只会setdata每次插入的数据。大大减少了setdata的大小。

发布了90 篇原创文章 · 获赞 4 · 访问量 2万+

猜你喜欢

转载自blog.csdn.net/qq_24935119/article/details/102498767
今日推荐