Vue + element-ui分页该怎么用?

Question

分页里的数据都动态渲染, 但是当点击分页的时候, 不会把当前点击的页面渲染出来, 默认是在第一页以下是正常第一页显示当点击第二分页还是显示默认第一页数据这是点击下一页的数据这是点击到第三页还是显示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();  }},

Answer 1

参数写错了, 正确的是params: { pageNum: this.query.currentPage }

Answer 2

没看到哪里不对。。。api返回数据确认没问题吗？

Answer 3

1、问题：分页函数的页数值你是赋值给this.query.pageNum，所以你打印this.query内的currentPage会一直是1。
2、谷歌这么好的浏览器，你可以直接在开发者工具Network上查看API请求参数，在headers下的Form Data即可看到。这样你才能去排查问题。