使用vue的keep-alive缓存组件,三级菜单组件无法缓存问题解决

发布时间 2023-05-09 19:46:53作者: 惠鹏曦

使用vue做后台管理系统,需求是所有的菜单打开之后,下次点击的时候的使用缓存,这里很简单的做法就是用来包裹住;但是一级菜单和二级菜单都没有问题,三级菜单就会出现无法缓存的问题,网上找资料说是vue中keep-alive本身存在的缺陷,需要在路由守卫中将matched属性做一下优化,具体如下

  // 处理keep-alive三级页面不缓存
  if (to.matched && to.matched.length > 2) {
    to.matched.splice(1,to.matched.length -2 )
    next()
  }

 

 

在beforeEach路由钩子中加一下这个判断就行了,亲测有效