测试组测出来的分页BUG啊啊啊!不想看废话的直接下拉到最后~
当前page是最后一页(40),切换size(40),显示没有数据???不信邪又试了几次,时而好使时而不好使…
既然出了问题,咱就来好好分析分析,打开控制台瞅一瞅,接口调用了两次!两次! 分别是 handleSizeChange() 和 handleCurrentChange()
- 切换size调用一次,此时传到后端是size:40 page:40
- 当前page变化再次调用接口,size:40 page:10
打开后端再看一看,竟然先返回了 handleCurrentChange() 的结果!这时是有数据的,紧接着又返回了 handleSizeChange() 的结果,总共也才 400 条数据,40×40肯定为空啊!!空空空如也~
解决方案:给fetchData()添加定时器,完美解决
handleSizeChange(val) {
this.pageSize=val
setTimeout(() => { this.fetchData() }, 0) // 刷新数据 !!!
}