elementui分页选择器el-pagination的bug,可使用current-page.sync解决

elementui分页选择器el-pagination的bug,可使用current-page.sync解决_第1张图片

在某个列表页,我点到第四页,然后选择其中某条数据进行编辑,打开编辑弹窗,编辑点确定后:

期望: 列表刷新,展示第一页数据,最下面也展示在第一页

实际效果:数据是刷新到了第一页的数据,但是最下面展示仍然在第四页,如下图:
elementui分页选择器el-pagination的bug,可使用current-page.sync解决_第2张图片

最开始我想的是直接修改el-pagination的currentPage值,最后发现不生效。

分析:产生这种情况的原因可能是路由里的参数currentPage是第四页,导致element-ui选择器展示当前在第四页, 但我请求接口的时候参数是第一页的参数,所以造成数据和页码不一致的现象。

解决:在el-pagination上加入current-page.sync
elementui分页选择器el-pagination的bug,可使用current-page.sync解决_第3张图片

每次弹框关闭后,修改currentPage值为1,再调用请求列表的方法,就可以了。

参考文章:https://blog.csdn.net/zxwbkzh/article/details/78965309

你可能感兴趣的:(前端,vue,elmentui-ui)