npm install v-pull-refresh

 //main.js
 import pullRefresh from 'v-pull-refresh'
 Vue.use(pullRefresh)

<template>
  <div style='height:400px;border:1px solid black;'>
    <pull-refresh
                  :list.sync="list"
                  ref="scroll"
                  @refresh="onRefresh"
                  @loadmore="loadmore"
    >
      <div class="list">
            <ul>
              <li v-for="(n, i) in list"
                  >{{ n }}
              </li>
            </ul>
      </div>
    </pull-refresh>
  <div>
</template>

<script>
 export default {
  data() {
    return {
      list: [1, 2, 3, 4, 5]
    };
  },
  methods: {
    onRefresh() {
      let arr = [],
        len = this.list.length;
      for (let i = len; i < len + 10; i++) {
        arr.push(i);
      }
      setTimeout(() => {
        this.list = this.list.concat(arr);
      }, 1000);
    },
    loadmore(pageindex) {
      console.log("加载pageindex", pageindex);
      if (i >= 3) {
        //数据上拉加载完成后，显示调用此方法后，滚动到底部将不会再派发
        this.$refs.scroll && this.$refs.scroll.forceUpdate();
        return;
      }
      let arr = [],
        len = this.list.length;
      for (let i = len; i < len + 10; i++) {
        arr.push(i);
      }
      setTimeout(() => {
        this.list = this.list.concat(arr);
      }, 1000);
    }
  }


</script>

<style lang='scss' scoped>
.list {
  width: 100%;
  background-color: white;
  overflow: hidden;
  li {
    display: flex;
    align-items: center;
    margin: 10px 0;
    justify-content: center;
  }
}
</style>