小程序的两种分页做法（后端返回分页及总页数字段与否）

佚名 6年前 (2019-05-09) 随笔 1314人围观抢沙发百度已收录

1.带分页

 onReachBottom:function () {
         // 如果还未到最后一页，继续加载
        if(this.data.page < this.data.last_page){
            this.setData({
                page:this.data.page+1
            })
            this.getProductList(false)
        }
    },

last_page接口获取；

2.不带分页

onReachBottom: function () {
        // 如果还未到最后一页，继续加载
        if (this.data.loadMore) {
            this.setData({
                page: this.data.page + 1
            })
            this.getProductList(false)
        }
    },

loadMore需做的处理：

SRE实战互联网时代守护先锋，助力企业售后服务体系运筹帷幄！一键直达领取阿里云限量特价优惠。

 if (res.data.data.length === 0 && _this.data.page !== 1) {
                        _this.setData({
                            loadMore: false
                        })
                        wx.showToast({
                            title: '没有更多内容啦！',
                            icon: 'none'
                        });
                    }

两者需要做统一处理的地方：

this.getProductList(false) --分页请求 this.getProductList() --非分页请求

 if (isReset) {
                        _this.setData({
                            productList: res.data.data,
                            // last_page:res.data.pagination.last_page,
                        })
                    } else {
                        _this.setData({
                            productList: _this.data.productList.concat(res.data.data),
                            // last_page:res.data.pagination.last_page,
                        })
                    }