paging is rendered dynamically, but when you click on paging, the currently clicked page will not be rendered. By default, the first page
below is normally displayed
1,
HTML
<div class="block">
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="query.currentPage" :page-size="query.pageSize" layout="total, prev, pager, next, jumper" :total="query.recordCount">
</el-pagination>
</div> data () {
return {
tableData: [],
query: {
pageNum: 1,
pageSize: 10,
currentPage: 1,
recordCount: 1150
}
};},
methods: {
createTableData() {
this.$http
.get(this.$api.tableData, { params: this.query.pageNum })
.then(res => {
if (res.status == 200) {
this.tableData = res.data.data.pageBean.recordList;
this.query.recordCount = res.data.data.pageBean.recordCount;
this.query.pageSize = res.data.data.pageBean.pageSize;
this.query.currentPage = res.data.data.pageBean.currentPage;
}else {
throw res.message;
}
})
.catch(err => {
console.log("createChartOne", err);
});
},
//
handleSizeChange(val) {
console.log(` ${val} `);
},
handleCurrentChange(pageNum) {
this.query.pageNum = pageNum;
this.createTableData();
},
created() {
this.createTableData();
}
},