handleSizeChange(val) { console.log(`每页 ${val} 条`); var _this = this _this.pageSize = val _this.token = sessionStorage.getItem("token") axios.get('http://localhost:8082/event/eventForm?page=' + _this.page +'&pageSize=' +_this.pageSize, { headers:{ 'token': _this.token } }) .then(function (ref) { console.log(ref.data) _this.tableData = ref.data.data.records _this.total = ref.data.data.total-0 }) }, handleCurrentChange(val) { console.log(`当前页: ${val}`); var _this = this _this.token = sessionStorage.getItem("token") _this.page = val axios.get('http://localhost:8082/event/eventForm?page=' + _this.page +'&pageSize=' +_this.pageSize, { headers:{ 'token': _this.token } }) .then(function (ref) { console.log(ref.data) _this.tableData = ref.data.data.records _this.total = ref.data.data.total-0 }) },

这是一个使用了 Vue.js 和 Axios 库的前端分页查询的方法。其中，handleSizeChange 方法用于在每页显示条数发生变化时触发，通过发送请求到后端，获取指定页码和指定每页显示条数的数据，同时更新表格的数据和总记录数。handleCurrentChange 方法用于在当前页发生变化时触发，同样通过发送请求到后端，获取指定页码和指定每页显示条数的数据，同时更新表格的数据和总记录数。这个分页查询的实现需要后端提供相应的接口支持，同时需要前端进行相应的参数配置和数据渲染。