耗时好长时间,终于给弄好了~~
1.首先要获取首页数据,代码如下:
在获取page的时候本地如果有的话,就从本地中获取,本地如果没有,就默认第一页,可以实现刷新页码不变的情况。
// 获取企业管理情况数据
getOrgList(){
let page = localStorage.getItem('page') || 1
getOrgManagerList({
page: page,
pageSize: 1,
}).then((res) => {
// console.log(res);
this.manage.tableData = res.data.list;
this.manage.page = res.data.page;
this.manage.pageSize = res.data.pageSize;
this.manage.total = res.data.total;
});
},
2.然后,在mounted或created中,调用1中的方法
mounted() {
this.getOrgList()
}
3.在分页组件事件@current-change事件中,每次页面改变,触发后台请求中,参数page的改变。代码如下:
handleCurrentChange(page) {
localStorage.setItem('page',page)
// console.log(page);
getOrgManagerList({
page: localStorage.getItem('page') || 1,
pageSize: 1,
}).then((res) => {
// console.log(res);
this.manage.tableData = res.data.list;
this.manage.page = res.data.page;
this.manage.pageSize = res.data.pageSize;
this.manage.total = res.data.total;
});
},
}
4.分页组件的代码如下:
<el-pagination
:current-page="manage.page"
:page-size="manage.pageSize"
:total="manage.total"
layout="total, prev, pager, next, jumper"
@current-change="handleCurrentChange"
@size-change="handleSizeChange"
v-if="manage.total != 0"
/>
如有错误,请多多指出~