Vue 3.2+ 中 无新增 API，但配合 defineOptions（Vue 3.3+ 推荐）可更简洁语义化配置缓存；组件必须有稳定显式 name 才能被正确匹配缓存，defineOptions({ name: 'XXX' }) 是关键基础。
在 Vue 3.2 及之后的版本里，defineOptions 语法配合使用时，事情就变得有趣了——它能让你以更简洁、更符合直觉的方式来配置组件缓存，从而告别在 setup() 里手动处理 name 或响应式逻辑的繁琐。
keep-alive 的核心机制没变，但配置方式更轻量
首先得明确一点，Vue 3 中 name（或 __name）属性来匹配 include 和 exclude 规则。这里有三个关键细节需要牢记：
- 组件必须拥有一个明确的、稳定且可被匹配的 name，这是它能否被正确缓存的前提。
- 默认情况下，函数式组件、匿名组件，以及那些没有显式命名的
defineComponent组件，都会被缓存机制跳过。 KeepAlive作为内置组件，并不参与 Vue 的响应式系统。这意味着它的 props（如include,exclude,max）仅在组件挂载时被解析一次。
defineOptions 让 name 和缓存元信息更清晰
在广泛使用的 随后，在布局组件中就可以这样使用： 这里有个技术点需要注意： 当使用 Vite、Rollup 等现代构建工具时，组件名可能会在压缩过程中丢失或被混淆，这常常是缓存失效的“隐形杀手”。为了避免踩坑，务必确保：
include 属性的值必须是字符串数组（或者正则表达式、逗号分隔的字符串），而不能是一个响应式引用。因此，实践中通常采用静态的白名单策略，或者配合组件的 key 属性来控制局部刷新。容易忽略的细节：name 必须“可读取”且“不被混淆”
__name 这类自动生成的属性，它在生产环境下很可能为空。build.minify: 'esbuild' 的配置，需要禁用标识符混淆（例如设置 minifyIdentifiers: false），否则你的 name 可能会被压缩成 a、b 这样的单字母，导致无法匹配。console.log(组件实例.$.type.name) 来验证组件在运行时的真实名称，这是一个非常实用的检查手段。
