在v-data-table部分配置參數：

:pagination.sync="pagination":total-items="totalItems"data ()?{totalItems: 5000,pagination:?{page: 1, rowsPerPage: 5},},watch:?{pagination:?{handler ()?{this.nextPage()},deep: true}},methods:?{nextPage ()?{this.totalItems = this.codeListAll.lengthvar temp =?[]if (this.codeListAll.length?- this.pagination.rowsPerPage *?(this.pagination.page?- 1)?>= 0)?{temp = this.codeListAll.slice(this.pagination.rowsPerPage *?(this.pagination.page?- 1), this.pagination.rowsPerPage * this.pagination.page)}var obj =?{}obj.codeList = temp.toString()this.$store.commit({type:?'searchNextPageCode',obj: obj,this: this})}

?

簡單記錄一下。

其中codeListAll是我需要獲取的Codelist，一共有5000條。每次根據指定的長度獲取關于這些Code的具體數據。所以我的nextPage 只實現根據codeList其中一部分獲取數據的內容

?

總的原理就是：當你按下翻頁按鈕時，就會觸發pagination的改變。其中pagination.page記錄頁碼，你需要自己實現根據不同頁碼截取不同數據的方法。

總結

以上是生活随笔為你收集整理的vuetify框架中服务端分页的实现方式(指定初始显示记录数)的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。