vue实现静态分页
2022-01-24 本文已影响0人
上海_前端_求内推
1,table分割
:data="tableData.slice((currentPage - 1) * pageSize,currentPage * pageSize)"
2,分页组件
<el-pagination
background
layout="total, sizes, prev, pager, next, jumper"
:total="tableData.length"
:page-size="pageSize"
@current-change="currentChange"
@size-change="handleSizeChange"
:page-sizes="[10,20,30]"
:current-page="currentPage"
>
</el-pagination>
3,data定义
pageSize:10,
currentPage:1,
4,js
currentChange(e) {
this.currentPage = e;
},
handleSizeChange(val) {
console.log(val);
this.pageSize = val;
},