解决方法:
<Page
v-if="pageshow"
:total="pageOption.total"
:loading="tableLoading"
:page-size="pageOption.size"
show-elevator
show-sizer
:page-size-opts="[10, 20, 50, 100]"
@on-change="changePage"
@on-page-size-change="changePageSize">
</Page>
操作:
这里element的分页有个bug,就是在搜索过后的当前页数据变化了,原本的分页当前页并不会改变,这就会遇见一个问题,首次展示停留在第5页,搜索过后的数据并没有5页,不论前台分页或后台分页,页面都会展示:暂无数据! 但其实是有数据的,只是额没有第五页的数据。所以在搜索的时候将当前页设置为1。
使用v-if绑定数据,当每次搜索的时候就注销掉前一个分页Dom,画面刷新完毕后,渲染一个同样的分页,重新渲染必须放到$nextTick中,这样在使用分页就不会出现问题了。
tabsActive(newValue) {
this.tabsList.forEach(item => {
if (newValue == item.value) {
this.tabsLabel = item.label;
}
});
this.pageOption.current = 1;
this.pageshow = false;
this.getSponsorsPage();
this.$nextTick(() => {
this.pageshow = true;
});
}
原文链接:https://blog.csdn.net/weixin_43216105/article/details/90044698