码迷,mamicode.com
首页 > 编程语言 > 详细

vue: 关于多路由公用模板,导致组件内数组缓存问题

时间:2018-03-23 15:16:54      阅读:266      评论:0      收藏:0      [点我收藏+]

标签:思路   分享   div   想法   数据   vue   load   挂载   多路由   

  当多个路由复用同一个模板,此时在这几个路由间切换,模板并不会重新挂载。针对这个情况,我们需要在当前逻辑内对路由做监听,在发生变化时更新对应属性,已满足需求。

  但是,在实现的过程中会遇到如下情况:

 技术分享图片

 

技术分享图片

技术分享图片

如图示,在页面切换的时候转入el-table的prop属性已经发生了变化,但是内循环绑定的并没有变化,原因是vue监听不到深层次的对象属性或者数组值的改变。

  解决办法就是在路由切换的时候,利用v-if指令绑定状态的过度。此处假设v-if="view === ‘main‘"代表显示,在切换的过程将view置为‘loading‘, 然后延时更新置为‘main‘, 这样列表展示会经历 "显示=>消失=>显示"的过程,列表组件会经历" 挂载 =>销毁=>挂载"的过程,使组件释放缓存数据强制更新,这样就符合了我们之前多页面复用模板灵活配置属性的设计。

  此处记录了我之前大概的解决思路,希望对各位有帮助。这个问题更多的考察我们对组件生命周期和属性双向绑定机制的一些理解。如有更多的想法、讨论,请留言给我。谢谢

 

vue: 关于多路由公用模板,导致组件内数组缓存问题

标签:思路   分享   div   想法   数据   vue   load   挂载   多路由   

原文地址:https://www.cnblogs.com/so-letitgo/p/8630112.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!