标签：VUE 56 视图 keep 缓存 alive 组件 路由

keep-alive

这是个标签，了解vue生命周期的话，我们知道组件也是一样，会执行一遍生命周期，组件每次都要创建/销毁 和一系列的操作 ，损耗肯定会变很大，所以我们这里的<keep-alive>标签可以使我们之前的组件缓存下来，不会执行很多次 生命周期，只会执行一次。

我们只需要把   <router-view></router-view>  用     <keep-alive>  包裹起来，就实现了 路由组件的缓存  ，操作发现一只切换也不会一只调用vue生命周期：

　　　　包裹起来

keep-alive标签配套的两个方法：

activated()  和  deactivated()　　　　　　一个是活跃函数  一个是不活跃函数，　　即如果当前组件处于活跃就调用activated,否则就调用deactivated。

这两个函数前提条件是 组件视图必须被  keep-alive 包含才起作用，那么就是要在缓存条件下起作用。

所以这就是 这个keep-alive 标签

我们如果是嵌套路由的情况下，，，想实现　　保持上次缓存视图（即 上次是哪个路由 回来就是那个路由【只有嵌套路由才能看出】）　　那么：

我们的首页嵌套了两个路由  新闻 和 信息, 如果本来是信息的页面 我点击了个人，再次点击首页的时候显示上次的视图组件（即信息页面）：

实现这个不能用生命周期函数，因为涉及到了路由的路径，既然涉及到了路由的路径，我么直接用导航守卫即可，我们就是要用【组件导航守卫】来解决：

　　　　就是用最后一个 离开组件的时候 对应路由的调用

具体实现包含很多处修改 自己去捣鼓即可

标签：VUE,56,视图,keep,缓存,alive,组件,路由
来源： https://www.cnblogs.com/bi-hu/p/15142909.html

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