• 我转过几个弯 绕过那个小雨楼
  • 拿着蒲扇摆着衣衫渡着紧箍咒
  • 不问天涯不停留 喝过几壶酒
  • 不过年少白头道义放胸口
  • 倘若明天之后 遥看前尘剑封侯
  • 似那天上神仙无所求
  • 朝朝暮暮君如梦醒十分不为何理由
  • 是真是假是惶恐是无休
  • 路过这风雨花满楼 片刻都不停留
  • 我本这书生进京赶考留下许多愁
  • 你问有没有时候 我叹这天道默悠悠
  • 能否与我一醉方休
  • 又过了几个弯 算尽天量道莫慌
  • 踏这田园闻这芳草香
  • 跌跌撞撞仗剑天涯折煞不枉无笔良
  • 是梦是幻是温柔是家乡
  • 路过这风雨花满楼 片刻都不停留
  • 我本这书生进京赶考留下许多愁
  • 你问有没有时候 我叹这天道默悠悠
  • 能否与我一醉方休
  • 路过这风雨花满楼 片刻都不停留
  • 我本这书生进京赶考留下许多愁
  • 你问有没有时候 我叹这天道默悠悠
  • 能否与我一醉方休
  • 谁能与我一醉方休

vue keep-alive导致再次进入父路由时不会自动切换到默认的子路由页面

最近写项目遇到一个问题,很头疼,几天了,问了好些大佬,都没有找到问题的解决方案,但是,最后还是被我找到了,可喜可贺...

问题

有一个home页,home页里面有router-link元素进行子路由切换,为了减少资源损耗,所以直接使用了keep-alive进行路由页缓存,假设有三个子路由abc,a路由页面有两个子路由a-1和a-2,默认是a-1显示。

当我们进入到a路由是,默认显示a-1,然后我们切换到a-2,然后路由push返回到home页,再次进入到a页面时,你会发现,a路由此时显示的a-2而不是a-1,但浏览器地址是a-1的地址,此时,我们可能没办法切换到a-1了。

问题图

为什么

主要因为keep-alive会缓存,当我们切换到a-2的时候,a路由缓存的就是a-2,本来按正常流程,我们可以通过go(-1)的方式返回到a-1,但是我们进入了home页,这样就打断了正常的返回流程,再次进入a路由是,由于keep-alive的效果,减少了重新加载dom,他会从缓存里读取之前缓存的内容,从而减少资源损耗。

但是也正因为这个效果,导致a页面直接拉取的缓存,所以下次进入的时候就是a-2了。

解决办法

此处内容已隐藏回复后方可阅读。

解决图

0
  • 本文分类:vue 项目实战
  • 本文标签:vuekeep-alive路由
  • 流行热度:已超过 196 人围观了本文
  • 最后更新:2020年07月23日 - 11时22分50秒
  • 发布日期:2020年07月23日 - 11时22分50秒
  • 版权申明:本文系作者@木灵鱼儿原创发布在木灵鱼儿 - 有梦就能远航站点。未经许可,禁止转载。

相关文章

微信收款码
微信收款码