//html代碼
//javascript代碼
export default {
name: 'InfiniteScroll',
data() {
return {
listData: [],   //數據列表
page: 1,  //頁碼數
limit: 10,  //每頁數據量
loading: false   //是否正在加載
}
},
mounted() {   //頁面加載時加載數據
this.loadData();
},
methods: {
loadData() {   //加載數據方法
if (this.loading) return;  //如果正在加載則退出
this.loading = true;   //標記正在加載
axios.get(`/api/list?page=${this.page}&limit=${this.limit}`).then(res =>{
this.listData = [...this.listData, ...res.data];   //將新數據加入已有數據列表中
this.page++;   //頁碼數加一
this.loading = false;   //加載完成，標記為false
})
}
}
}

上述代碼分為html和javascript代碼兩部分，其中html代碼使用了v-infinite-scroll指令來實現滾動加載。這個指令會在滾動到下方時自動觸發執行loadData函數，并根據函數返回值來判斷是否繼續滾動加載。然后，javascript代碼中定義了一個名為InfiniteScroll的組件，其中包含了一些屬性和方法。其中loadData方法用來加載數據，并將新數據加入已有數據列表中。在頁面加載完成之后，會立即執行loadData方法，從而實現無限滾動加載數據的功能。

總的來說，Vue的div滾動功能非常實用，能夠幫助開發者輕松地實現數據的無限滾動加載效果。使用Vue框架開發網頁或移動應用，無論是實現什么功能都可以加入div滾動功能來提升用戶體驗。希望本文對您有所幫助，謝謝！