小程序分页加载

 
  
    //内容
    
  
  
    
  
  
    没有更多了
  

data:{
  page:1,//分页
    page_size:8,//一页的数据
    goods_list:[],//商品列表
    scrollViewHeight:400,
    loadMore:true,//是否启动滚动加载
    isLoading:false,//是否正在加载
    isShowNoGoods:false,//是否显示没有数据
    isShowNoMoreGoods:false,//是否显示没有更多了
},
 loadMoreGoods:function(){
    var that = this;
    //显示正在加载动画
    that.setData({
      isLoading: true,
    })
    MBC.Ajax({
      url: api.searchGoods,
      is_login: true,
      data: {
        goods_name: that.data.searchValue,
        class_id: that.data.class_id,
        page: that.data.page,
        page_size: that.data.page_size
      },
      success: function (res) {
        if(res.result.goods_list == 0 && that.data.page == '1'){
          //第一页就没有数据
          that.setData({
            isShowNoGoods:true,//显示没有数据
            loadMore: false,//不启用滚动加载
            isLoading: false,//结束加载动画
          })
        }
        if (res.result.goods_list.length == 0) {
          that.setData({
            loadMore: false,//不启用滚动加载
            isLoading: false,//结束加载动画
            isShowNoMoreGoods: true,//显示没有更多数据
          })
        } else if (res.result.goods_list.length > 0 && res.result.goods_list.length < that.data.page_size) {
          that.data.goods_list.push(...res.result.goods_list);
          that.setData({
            goods_list: that.data.goods_list,
            page: that.data.page + 1,
            loadMore: false,
            isLoading: false,
            isShowNoMoreGoods: true,//显示没有更多数据
          })
        } else if (res.result.goods_list.length >= that.data.page_size) {
          that.data.goods_list.push(...res.result.goods_list);
          that.setData({
            goods_list: that.data.goods_list,
            page: that.data.page + 1,
            loadMore: true,
            isLoading: false,
          })
        }
      }
    })
  },
  //滚动到底部触发
  scrollToLower: function (event){
    var that = this;
    console.log(event);
    if (that.data.loadMore){
      that.loadMoreGoods();
    }else{
      that.setData({
        isShowNoMoreGoods: true,//显示没有更多数据
      })
      console.log("没有更多的数据了");
    }
  },

.no-goods{
  width:150px;
  height: 150px;
  position: absolute;
  left: 50%;
  top: 40%;
  margin-left: -75px;
  margin-top: -75px;
  display: flex;
  justify-content: center;
}
.no-more-goods{
  display:flex;
  justify-content:center;
  padding:20px 0;
  position: relative;
}
.no-goods image{
  width: 100%;
  height: 100%;
}
.goods-scroll-view{
  position: relative;
}
.isLoading-tip{
  display:flex;
  justify-content:center;
  padding:20px 0;

}

  "usingComponents": {
        "van-loading": "../../components/VantWeapp/lib/loading/index"
  },