微信小程序上拉刷新页面数据

悠悠 2023-07-22 09:23 56阅读 0赞

在微信小程序当中当在上拉的时候要显示下一页的数据的时候就需要用到上拉刷新事件。
首先要获取数据总条数以及一页有多少条数据,再使用Math的向上取整计算得出一共有多少页。以下代码为例:总页数/一页数据的量

  1. this.totalPages=Math.ceil(total/this.QueryParmams.pagesize);

在这里之后获取的数据不再是直接覆盖而是要使用拼接:

  1. this.setData({
  2. goodslist:[...this.data.goodslist,...res.goods]
  3. })

最后加上事件的业务逻辑:使用if判断,存在数据时,页数+1,再一次调用获取接口数据的函数。

  1. onReachBottom(){
  2. console.log("向上滑动")
  3. //判断是否还有下一条数据
  4. if(this.QueryParmams.pagenum>=this.totalPages){
  5. //表示没有下一页数据
  6. //console.log("没有下一页数据")
  7. wx.showToast({ title:'已经到底了'})
  8. }else{
  9. console.log("有下一页数据")
  10. this.QueryParmams.pagenum++;
  11. this.GetGoodsList();
  12. }
  13. },

效果图如下:在滚动之后获取所有的数据之后将不再有数据直接给出提示。wx.showToast
在这里插入图片描述

发表评论

表情:
评论列表 (有 0 条评论,56人围观)

还没有评论,来说两句吧...

相关阅读

    相关 程序刷新页面数据

    在微信小程序当中当在上拉的时候要显示下一页的数据的时候就需要用到上拉刷新事件。 首先要获取数据总条数以及一页有多少条数据,再使用Math的向上取整计算得出一共有多少页。以下