vue-infinite-scroll

1.安装

npm install vue-infinite-scroll --save

2.如果多处用到可以考虑在main.js中引入。如果只有单个页面使用，可以考虑在当前页中引入。

import infiniteScroll from 'vue-infinite-scroll'
import Vue from 'vue';（当前页中须引入）
Vue.use(infiniteScroll)

3.使用

 <div
       v-infinite-scroll="handleInfiniteOnLoad"//页面滚动的回调函数
      :infinite-scroll-disabled="busy"//false表示执行handleInfiniteOnLoad，true表示不执行
      :infinite-scroll-distance="10"//页面滚动到离页尾多少像素的时候触发回调函数
  >
     <div v-for="item in data" :key="item.key">

     </div>
  </div>
  <div class="noMore" v-if="busy">没有更多了</div>

  data () {
    return {
      data: [],
      busy: false,
      page：1,//页数
    }
  }

  methods: {
    loadMore() {
        //调用ajax,当获取到最后一组数据时，this.busy = false
    },
    handleInfiniteOnLoad(){
       //该方法中可以调用loadMore()方法加载数据
    }
  }

如果这里没有您需要的，可以参考：官方文档。