微信小程序分页列表setData数据过大问题

解决方法-分页渲染数据

//index.js
Page({
  data: {
    list: [],
    page: 1,
    pageNumber: 10
  },
  onLoad: function() {
    this.loadData();
  },

  loadData() {
    let data = [];
    for (let i = 0; i < this.data.pageNumber; i++) {
      data.push(1 + i + (this.data.page - 1) * this.data.pageNumber)
    }
    if (this.data.page == 1) {
      this.setData({
        list: []
      })
    }
    this.setData({
      [`list[${this.data.page-1}]`]: data//分页渲染数据
    })
    wx.stopPullDownRefresh()
    wx.hideLoading()
  },

  onPullDownRefresh() {
    this.setData({
      page: 1
    })
    setTimeout(()=>{
      this.loadData();
    },1000)
  },

  onReachBottom() {
    this.setData({
      page: ++this.data.page
    })
    wx.showLoading()
    setTimeout(() => {
      this.loadData();
    }, 1000)
  }
})

<view class="list-box">
  <view class="list-page" wx:for="{{list}}" wx:for-item="pitem" wx:for-index="pindex" wx:key="{{pindex}}">
    <view class="list-item" wx:for="{{pitem}}" wx:key="{{index}}">{{item}}view>
  view>
view>

/* index.wxss */
.list-item{
  height: 200rpx;
  background: #ddd;
  display: flex;
  align-items: center;
  justify-content: center;
  border-bottom: 1px solid #fff;
}

代码片段：https://developers.weixin.qq.com/s/UbUwP7mh7uav