外观
keep-alive 缓存的是什么？
keep-alive 让离开的组件实例留下来，而不是销毁。回来时走 activated，状态和 DOM 都还在。适合页签和列表进详情再返回。缓存要有上限，否则离开过的页面都会留在内存里。
原理
它是抽象组件，自己不渲染额外的结构，内部用缓存存子组件的虚拟节点。include 和 exclude 按组件名匹配，组件必须有稳定的 name。max 限制个数，超出时丢掉最久没用的实例。
被缓存的组件第一次仍会 mounted。之后隐藏走 deactivated，再次显示走 activated，不会再次 mounted，也不会 unmounted，直到它被移出缓存或 keep-alive 本身销毁。
请求不要只放在 onMounted。从详情返回时如果希望刷新，放在 onActivated，并避免每次激活都无条件打接口。滚动位置如果产品需要保留，就不要在激活时把列表滚回顶部。
动态组件 <component :is> 配 keep-alive 是页签的常见写法。键要稳定，否则 Vue 认为是另一个组件，缓存对不上。
追问
怎么强制刷新一块缓存？
改组件的 key 会丢掉旧实例。这是整块重建，不是细粒度更新。只想更新数据时，在 activated 里重新请求，保留表单之外的列表数据。
和路由缓存的关系？
路由视图外面包 keep-alive，被匹配到的路由组件才会留下。include 里写路由组件的名字，不要把所有页面都缓存。
易错点
- 组件没有
name，include永远匹配不到。 - 以为缓存之后
mounted每次进入都会执行。 - 不设
max，后台页签里的大列表一直不释放。