微信小程序-懒加载

微信小程序基于Json-server-懒加载

懒加载 - 一次请求5条数据，触底再次请求

current:1, //定义当前页数
total:0,   //定义总数据条数

wx.request({   // 首次请求商品列表
   url: 'http://localhost:3000/goods?_page=1&_limit=5',
   success:(res)=>{
       this.total = res.header["X-Total-Count"] //总数据长度
       this.setData({
          datalist:res.data
       })
   }
}) 

// 触底加载5条数据
onReachBottom: function () {
    // 如果数据请求完整，显示提示并返回
    if(this.data.datalist.length >= this.total){
      this.setData({
        isShow:true  
      })    
      return
    }
    // 否则继续请求下一页
    this.current++
    wx.request({
      url: `http://localhost:3000/goods?_page=${this.current}&_limit=5`,
      success:(res)=>{
        this.setData({
          datalist:[...this.data.datalist,...res.data]
        })
      }
    }) 
}