ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

el-pagination 视图更新问题

2021-11-01 14:02:41  阅读:228  来源: 互联网

标签:el pagination paginationShow 页码 视图 current 换页 true page


element 分页组件在 换页 的时候,画面数据正确,但 页码却没被激活, 即 还处于换页之前的页码。

如图

百度搜索,尝试了很多种方案,比如 加上current-page.sync 修饰、结合localStorage利用 created() beforeUpdate () beforeDestroy ()方法,重置current-page属性值..

不知道是我没写对还是其他原因,反正 最后都没成功。

 

偶然 尝试了一种新的方式 v-if,发现有用,拿来分享。

 

在 el-pagination 中加  v-if指令,根据 true or false 来进行渲染。

 

data里面初始化paginationShow为true

在 查询方法(因为我的查询方法会调到callHttpRequest() ,所以写在这里)里把paginationShow置为false

在接口请求完毕后,将paginationShow改为true

看到有人说需要在$nextTick画面刷新完毕后再更改值,否则没效果, 但 我发现 好像关系不大。。

总之,现在页码正常啦。

 

调试过程中发现, 其实在点击换页之后 vue 是有刷新 current-page的,感觉中间会刷新几次,在最后一次的时候,是取的初始化的默认值。

标签:el,pagination,paginationShow,页码,视图,current,换页,true,page
来源: https://www.cnblogs.com/coderwhytop/p/15493282.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有