<van-list class="list_box" v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad" > <van-cell class="list_box_item" v-for="(item,index) in list" :key="index"> <div>...</div> </van-cell> </van-list>
list: [], loading: false, finished: false, search: { page: 0, //页数 limit: 6, //条数 totalCount:100 },
onLoad() { // 异步更新数据 this.getData(); }, onRefresh() { // 清空列表数据 this.finished = false; // 重新加载数据 // 将 loading 设置为 true,表示处于加载状态 this.loading = true; this.onLoad(); },
// 列表 getData() { this.loading = true; this.search.page += 1; this.$http .get("接口", { params: { ...this.search, }, }) .then((res) => { this.search.total = res.data.totalPage; // 多少页数 this.search.totalCount = res.data.totalCount; // 数据总数 this.search.page = res.data.currPage; // 当前页数 this.list.push(...res.data.list); // 加载状态结束 this.loading = false; if (this.list.length >= this.search.totalCount) { this.finished = true; } }); },