滚动条触底 加载下一页数据

页面再加载

当我们使用返回数据量大的接口的时候,如果全部申请回来,就会影响项目的性能,滚动条触底再加载下一页数据能确保用户讲页面拉到页面底部的时候再去申请下一页的数据

实现原理

1. 找到滚动条触底事件
   使用的是微信小程序中的 onReachBottom
2. 判断还有没有下一页数据
   1. 获取到申请回来的总页数,如果只有总条数的话就用Math.ceil(总条数/页容量)
   2. 判断当前的页码
   3. 比较页码和总页数
      1. 页码>总页数 数据加载完了 弹出一个wx.showToast提示加载完成
      2. 页码<总页数 加载下一页数据 重新加载时,data中当前的页码要加一
      3. 取回来的数据不能直接覆盖之前的数据,要和之前的数据一起拼接起来

微信小程序页面再加载

页面上滑 滚动条触底事件

    //页面上滑 滚动条触底事件
    onReachBottom(){
   
        if(this.QueryParams.pagenum >= this.totalPages){
   
            //没有下一页数据
            wx.