vue（12）-keep-alive

一、钩子触发顺序

当引入keep-alive 的时候，页面第一次进入，钩子的触发顺序created-> mounted-> activated，退出时触发deactivated。当再次进入（前进或者后退）时，只触发activated。

二、mounted和 activated

Keep-alive加了，同一个页面的mount就只会激活一次，如果需要每次进入都激活，用 activated

三、用法

实际上，我们在Vue项目的开发中，组件之间的相互切换（页面跳转）时，为了减少浏览器运行负担，有些组件是没有必要每次都要销毁和重建的。这个时候，Vue提供的<keep-alive>极大地帮助了我们解决这个问题，他通过缓存组件内部状态来避免组件的多次销毁。

用法：

// keep-alive可以将Vue的路由组件都缓存起来，我们在项目中基本上都是碰到的这种使用方法

<keep-alive>

    <router-view></router-view>

</keep-alive>

四、通过router的meta

• 图1，router.js中如何配置
• index.vue中如何定义
• 页面如何控制，什么时候keep-alive，什么时候直接刷新