Vue: keep-alive的使用

作用：
组件切换时保持组件状态不被销毁
属性：
include——包括：值为字符串或正则表达式或数组；指定的组件被缓存
exclude——不包括：值为字符串或正则表达式或数组；指定的组件不被缓存
exclude优先级高于include
用法：

<keep-alive include="home,about" >
    <router-view></router-view>
</keep-alive>

<keep-alive exclude="home,about" >
    <router-view></router-view>
</keep-alive>

或者

{
 path: '/',
 name : "home',
 meta:{ keepAlive:true }
 component: Home
}

或者keep-alive包裹动态组件

<keep-alive include="home" exclude="about">
     <component :is="whichComponent"></component>
</keep-alive>

缓存之后组件中事件的执行顺序

//初始进入和离开 
created ---> mounted ---> activated --> deactivated
//后续进入和离开 
activated --> deactivated