关于Vant-list 上拉加载以及下拉刷新问题
第一步引入
import { Notify, Dialog, Image, List, PullRefresh } from 'vant'
import Vue from 'vue'
Vue.use(Image).use(List).use(PullRefresh)
第二步
<van-pull-refresh v-model="refreshing" @refresh="onRefresh">
<van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
<!-- 这里根据自己需要展示数据 -->
</van-list>
</van-pull-refresh>
第三步
data () {
return {
productList: [], //异步查询数据
loading: false, //自定义底部加载中提示
finished: false,//自定义加载完成后的提示文案
refreshing: false,//清空列表数据
pageNo: 0 //当前页码
}
}
第四步
methods: {
onLoad () {
this.pageNo++
setTimeout(() => {
if (this.refreshing) {