template:
<el-pagination
background
:pager-count="5"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="currentPage"
:page-sizes="[10, 20, 50, 100]"
:page-size="pageSize"
layout="sizes, prev, pager, next, jumper"
:total="total"
></el-pagination>
data:
data() {
retun {
currentPage: 1,
total: 0,
pageSize: 10,
tableData:[]
totalPage: [],
dataShow: []
}
}
mounted:
this.initList()
methods:
initList(){
this.dataShow=this.tableData.slice(0,10)
},
pagination() {
if (this.tableData) {
let pageNum = Math.ceil(this.tableData.length / this.pageSize) || 1
for (let i = 0; i < pageNum; i++) {
this.totalPage[i] = this.tableData.slice(
this.pageSize * i,
this.pageSize * (i + 1)
)
}
this.dataShow = this.totalPage[this.currentPage - 1]
}
},
handleSizeChange(val) {
this.pageSize = val
this.currentPage = 1
this.pagination()
},
handleCurrentChange(val) {
this.currentPage = val
this.pagination()
},
