VUE上拉加载更多，基于vant框架

1.在data中定义初始的状态

	  loading: false,
      finished: false,
      offset:100,//滚动条与底部距离小于 offset 时触发load事件
      page:1

2.在需要分页的地方，用van-list进行包裹

  <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
      <van-tabs color="#0197ee" @click="handleClick">
          <van-tab title="XXX">
          </van-tab>
          <van-tab title="XXX">
          </van-tab>
      </van-tabs>
  </van-list>

3.获取数据

    getList() {
      this.$fetchPost("*****/*****", {
        user_id: this.userId,
        page_num: this.page,
      })
        .then(response => {
          if (response.data.code == 1 && response.data.data.length > 0) {
          	// 加载状态结束如果请求到数据，将数据拼接在一起
            this.kindergartenList.push(...response.data.data);
            // 加载状态结束
            this.loading = false;
          } else {
            this.loading = false;
            this.finished = true;
          }
        })
        .catch(res => {
          return false;
        });
    },

4.设置触发需要的参数,同时调用请求数据的函数

onLoad() {
      this.page++;
      this.getList();
    },

需要注意：
一般默认情况，页面请求的数据，不足一页是，会自动触发onload事件，所以尽量保证第一屏数据足够。