keep-alive介绍
Vue的抽象组件，自身不会渲染一个DOM元素，也不会出现在父组件链中，能将组件在切换过程中将状态保存在内存中，防止重复渲染DOM
包裹动态组建时，会缓存不活动的组件实例，而不是销毁它们
当组件在 keep-alive内被切换时，它的activated和deactivated这两个生命周期钩子函数将会被执行
Props
include - 字符串或正则表达式。只有名称匹配的组件会被缓存
exclude - 字符串或正则表达式。任何名称匹配的组件都不会被缓存
max - 数字。最多可以缓存多少组件实例
匹配规则
匹配首先检查组件自身的 name 选项，如果 name 选项不可用，则匹配它的局部注册名称 (父组件 components 选项的键值)。匿名组件不能被匹配，这里匿名组件暂时还没有具体搞懂，希望有大神路过此地时指点一二。
注意
include 和 exclude 属性允许组件有条件地缓存。二者都可以用逗号分隔字符串、正则表达式或一个数组来表示
exclude优先级大于include
max:最多可以缓存多少组件实例。一旦这个数字达到了，在新实例被创建之前，已缓存组件中最久没有被访问的实例会被销毁掉
keep-alive 要求被切换到的组件都有自己的名字，不论是通过组件的 name 选项还是局部/全局注册
字符串和数组表示的区别：
当:include=""为空字符串时，代表被keep-alive包裹的组件都缓存
当:include=[]为空数组时，代表不缓存被keep-alive包裹的组件
<keep-alive>嵌套<keep-alive>对max的影响
外层<keep-alive>中设置的max只对它包裹的组件有影响
外层嵌套的内层<keep-alive>内的缓存组件数量不会加到外层<keep-alive>的max上，
动态删除外层缓存的某组件，则其内层<keep-alive>缓存的组件也会一并删除
keep-alive包裹的组件多出的钩子函数
activated：组件激活时调用，在组件第一次渲染时也会被调用，之后每次keep-alive激活时被调用
deactivated：组件停用时调用
说明
当组件第一次渲染时activated也会被调用，即beforeCreate -> created -> beforeMount -> mounted -> activated
当跳转另一组件时即当前组件被停用时，则只会调用deactivated，它的beforeDestroy和destroy不会被调用
当再次激活此组件时，则也只会调用activated，其它钩子函数也不会调用
注意
只有组件被keep-alive包裹时，这两个生命周期函数才会被调用，正常组件不会调用这两个函数
使用exclude排除之后的组件，就算包裹在keep-alive中，这两个函数也不会被调用
在服务器端渲染期间不被调用