vue-infinite-scroll上拉加載沒反應？不斷重復加載？

<script src="../node_modules/vue-infinite-scroll/vue-infinite-scroll.js"></script>

<div class="myScroll" v-infinite-scroll="loadMore" infinite-scroll-disabled="busy" infinite-scroll-distance="10">
    <ul>
        <li>aaaaaa</li>
        <li>bbbbbbbb</li>
        <li>vvvvvvvvv</li>
    </ul>
</div>

loadMore(){
    this.busy = true;
    this.pageSize++;
    axios({
        //請求數據
    })
    this.busy = false;
}

.myScroll {
    max-height: 600px;
    overflow-y: auto;
}

這是一個比較常用的模式，但是細節東西可能讓人會摸不着頭腦。首先，要讓loadMore事件觸發，.myScroll必須設置高度以及溢出滾動。busy的初始值為false，上拉加載就好了。

上面是正常使用的情況，下面我們說下常見的坑：

1.上拉沒反應

解決：

①要填充數據的盒必須設置高度、溢出滾動(overflow-y : auto)，才會觸發loadMore事件。

②發送請求之前，將無線滾動禁掉this.busy = true,數據請求之后，無線滾動設置為false。

2.頁面沒有任何操作，不斷發送請求進行加載

解決：

數據請求完成之后，this.busy = false放在ajax請求外面；這樣可以避免，當請求數據為0時，不斷重復加載。