uni-app scroll-view+u-loadmore 实现下拉加载更多数据

接口返回数据格式:

图片.png

        
            
        
data(){
    return{
            page: 1,//分页初始化
            allpage:1,//接口返回总分页
            status: 'loadmore',//加载状态
    }
}
//获取数据接口
getList() {
                this.http({
                    url: "/cpgl/sjgdlbjk",
                    data: {
                        pageNo: this.page,
                        pageSize: 10,
                    },
                    method: 'GET',
                    success: data => {
                        if (data.code === 200) {
                            this.allpage = data.data.pages
                            if (data.data.records.length < 10) {
                                this.status = 'nomore'
                            } else {
                                this.status = 'loadmore'
                            }
                            this.list = this.page === 1 ? data.data.records : [...this.list, ...data.data.records];
                        } else {
                            uni.$u.toast(`${data.msg}`);
                        }
                    },
                    fail: err => {
                        
                        console.error("===>>>", err);

                    }
                })
            },
//触底加载更多
            ScrollToLower(e) {
                if (this.page >= this.allpage) {
                    this.status = "noMore"
                    return;
                } else {
                    this.status = "loading"
                }
                this.page = this.page + 1;
                this.getList()
            },

你可能感兴趣的:(uni-app scroll-view+u-loadmore 实现下拉加载更多数据)