ant design vue table分页 onShowSizeChange 后的 pageNo 问题
onSizeChange 后当前页问题首先,大致描述一下出现这个问题的情形:data(){return {pagination: {pageNo: 1,pageSize: 5,total:0,showSizeChanger: true,p...
·
onSizeChange 后当前页问题
首先,大致描述一下出现这个问题的情形:
data(){
return {
pagination: {
pageNo: 1,
pageSize: 5,
total:0,
showSizeChanger: true,
pageSizeOptions: ['5', '10', '50'],
showTotal: total => `共 ${total} 条`,
onShowSizeChange: (current, pageSize) => this.onSizeChange(current, pageSize),
onChange:(page,pageSize)=> this.onPageChange(page, pageSize)
},
}
},
methods: {
onPageChange(page, pageSize) {
this.pagination.pageNo = page
this.getList()
},
onSizeChange(current, pageSize) {
this.pagination.pageNo = 1
this.pagination.pageSize = pageSize
this.getList()
}
}
页面加载数据,pageNo 是 1, pageSize 是 5,假如接口返回 total 是 12,这时分页有3页,选择第2页,然后改变每页条数为10,onSizeChange 里面设置了this.pagination.pageNo = 1,但是得到的结果是 当前页在第2页.
原因分析
自己百度查找并没有找到解决的方法,还希望哪个高手给指点下(不知道是不是 antd的bug)
解决方法: 升级 antd 版本
后来看了下官方文档,发现新的版本 已经舍弃了 pageNo,改用 current,上面的问题在版本升级后也没再出现,我之前使用的版本是"ant-design-vue": "~1.3.8",现在官网的版本是1.5.3,如果有遇到类似问题的小伙伴可以升级下版本试试.
onSizeChange(current, pageSize) {
this.pagination.current= 1
this.pagination.pageSize = pageSize
this.getList()
}
更多推荐



所有评论(0)