1，這里用的是element-ui
分頁的組件代碼

<el-pagination@size-change="handleSizeChange"@current-change="handleCurrentChange"layout="total, prev, pager, next":total="100"style="margin-top: 20px"></el-pagination>

size-change: pageSize 改變時會觸發,也就是每頁條數
current-change:currentPage 改變時會觸發,也就是當前頁
layout：組件布局，子組件名用逗號分隔
total: 數據的數量

2，在table組件添加一個page - size

handleSizeChange (val) {this.PageSize = val},handleCurrentChange (val) {this.currentPage = val},// 序號自增indexMethod (index) {return (this.currentPage - 1) * 10 + index + 1},

序號自增是方便數據如果有id，可以直接變更數據順序

總結

以上是生活随笔為你收集整理的vue分页的设置的全部內容，希望文章能夠幫你解決所遇到的問題。

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