使用el-table实现前端分页

将数据请求回来后，前端使用slice()方法对数据进行切割，再配合分页组件即可实现分页效果。

<el-table
   :data=" tableList.slice((currentPage - 1) * pageSize, currentPage * pageSize) "
>...

• currentPage 当前页数
• pageSize 每页的数据个数
• slice(n,m)查找数组中两个索引之间的内容 返回新数组从n开始不含m

<el-pagination
  @size-change="handleSizeChange"
  @current-change="handleCurrentChange"
  :current-page="currentPage"
  :page-size="pageSize"
  layout="total, prev, pager, next"
  :total="total"
  >
</el-pagination>

• size-change 是pageSize 改变时会触发的函数
• current-change 是currentPage 改变时会触发的函数

handleSizeChange(val) {
    this.pageSize = val;
},
handleCurrentChange(val) {
    this.currentPage = val;
}

参考链接：element中使用前端分页 (opens new window)