<template><div class="sg-page-body"><div class="sg-list"><van-pull-refresh v-model="pullLoading" @refresh="onPullRefresh" success-text="刷新成功"><van-list v-model="listLoading" @load="onLoadList" :finished="finishedList" finished-text="没有更多了"><van-card v-for="(item,$index) in list" :key="$index">{
{item.label}}</van-card></van-list></van-pull-refresh></div></div>
</template><script>export default {data() {return {list: [], //列表数组listLoading: false, //上滑列表加载(每一次上滑的时候)finishedList: false, //上滑列表加载完了所有数据(没有更多了)pullLoading: false, //下拉刷新加载动画start: 0, //从第1页开始limit: 10, //每页10条数据累加qylx: ""};},methods: {//下拉刷新列表■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■onPullRefresh() {this.list = [];this.start = 0;this.finishedList = false;this.onLoadList();},//上滑加载列表________________________onLoadList() {// 异步更新数据if (this.finishedList) return;var data = {start: this.start,limit: this.limit,qylx: this.qylx};this.$d.API_NAME(data, {success: d => {/*这里写代码*/this.list = this.list.concat(d);this.pullLoading = this.listLoading = false; // 加载和下拉状态结束this.finishedList = d.length === 0; //上滑列表加载完了所有数据(没有更多了)}});this.start++;}// ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■}};
</script>