整体代码
<template>
<div class="container">
<el-table
:data="tableData.slice((page-1)*size, page*size)"
style="width: 100%">
<el-table-column
prop="date"
label="日期"
width="180">
</el-table-column>
<el-table-column
prop="name"
label="姓名"
width="180">
</el-table-column>
<el-table-column
prop="address"
label="地址">
</el-table-column>
</el-table>
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="page"
:page-sizes="[100, 200, 300, 400]"
:page-size="size"
layout="total, sizes, prev, pager, next, jumper"
:total="totol">
</el-pagination>
</div>
</template>
export default {
data() {
return {
page: 1,
size: 10,
totol: 0,
tableData: []
};
},
mounted() {},
methods: {
handleSizeChange(size) {
this.size = size
},
handleCurrentChange(page) {
this.page = page
}
},
};