vue滚动加载插件vue-infinite-scroll

1. GitHub地址：https://github.com/ElemeFE/vue-infinite-scroll
2. 安装： npm i vue-infinite-scroll --save
3. 使用

    <div class="table__div" v-infinite-scroll="loadMore" infinite-scroll-disabled="busy" infinite-scroll-distance="10">
        <div v-for="item in data" :key="item.index">{{item.name}}</div>
    </div>

在vue的method里面加上这个方法，即：滚动条滑到底部时调用

 loadMore() {
       		this.busy = true
            setTimeout(() => {
                for (var i = 0, j = 10; i < j; i++) {
                this.data.push({name: this.count++ })
                }
                console.log(this.data)
                this.busy = false
            }, 1000)
        },

data中定义这三个值，如下图

// data中加入这三个值
count: 0,
data: [],
busy: true

// 同时引入,别忘记引入

import Vue from 'vue';
import infiniteScroll from 'vue-infinite-scroll'
Vue.use(infiniteScroll)

效果图如下，当滚动条滑动到底部就会从新获取新的10个值