原文：vue使用keep-alive出现的的activated和deactivated生命周期
lt keep alive gt 包裹的动态组件会被缓存，它是一个抽象组件，它自身不会渲染一个dom元素，也不会出现在父组件链中。当组件在 lt keep alive gt 内被切换，它的 activated 和 deactivated 这两个生命周期钩子函数将会被对应执行。 如 lt keep alive gt 包裹两个组件：组件A和组件B。当第一次切换到组件A时，组件A的created和ac ...
2020-01-19 11:54 0 1677 推荐指数：
相关推荐
keep-alive 简介 keep-alive 是 Vue 内置的一个组件，可以使被包含的组件保留状态，或避免重新渲染。 用法 props include - 字符串或正则表达，只有匹配的组件会被缓存 exclude - 字符串或正则表达式，任何匹配的组件都不会 ...
keep-aliveProps：include - 字符串或正则表达式。只有名称匹配的组件会被缓存。exclude - 字符串或正则表达式。任何名称匹配的组件都不会被缓存。max - 数字。最多可以缓存多少组件实例。用法：<keep-alive> 包裹动态组件时，会缓存不活动的组件实例 ...
keep-alive 生命周期 父组件 组件A： 组件B： 切换组件A和组件B，控制台打印： 结论： 首次激活时，activated都在mounted后。 再次激活时，本组件只走activated（另外一组件先失活deactivated） 组件失活时，均不 ...
beforecreated： 创建前状态 el 和 data 并未初始化 created: 创建完毕状态 完成了 data 数据的初始化，el没有 beforeM ...
前提： vue + typescript ，组件采用 vue-property-decorator + class 作为组件的方式。 最近开发项目，用了 keep-alive 来缓存路由，以前使用路由缓存，都是设置 meta:{ keepAlive:true} 的方式，直接编写路由的时候配置 ...
keep-alive缓存（ 一般都要将首次创建的组件缓存，提高性能） keep-alive对应两个生命周期,activated(){} deactivated ...
1、通过keep-alive和router-view实现路由缓存，具体代码如下：在app.vue： <router-view v-if="!$route.meta.keepAlive"/> <keep-alive> <router-view v-if ...