1.keep-alive干嘛用的？
keep-alive用于缓存页面，此时切换组件不会触发destroyed钩子，重新进入组件不会触发created钩子，而是触发activated钩子
2.为什么在include中填上name不生效？
有两种可能，第一种是include里的name是在对应的Vue组件中Vue实例的name属性，而不是路由配置里的name属性
//√
export default {
name: "XXX",
}
//×
{
path: "/xxx",
name: "XXX",
component: XXX,
},
第二种是有嵌套路由，<keep-alive include="XXX">要包裹直接关联的<router-view />
3.我只想在顶层的<router-view />写keep-alive怎么实现？
配合路由配置一起使用，见如下代码
<keep-alive>
<router-view v-if="$route.meta.keepAlive" />
</keep-alive>
<router-view v-if="!$route.meta.keepAlive" />
{
path: "/",
name: "Login",
component: Login,
meta: {
keepAlive: true,
},
},
4.keep-alive有什么使用场景呢？
比如填写表单或者富文本，其中要切换到其他页面操作，此时我们当然希望填写的东西能缓存下来
5.只是在页面后退时缓存怎么实现？
更改 beforeEach钩子。
let toDepth = to.path.split('/').length
let fromDepth = from.path.split('/').length
if (toDepth < fromDepth) {
// console.log('back...')
from.meta.keepAlive = false
to.meta.keepAlive = true
}
