KeepAlive 的 exclude 属性用于指定不参与缓存的组件，支持字符串、正则和数组三种值类型，常配合 router-view 动态控制缓存行为，并需注意组件 name 的显式声明。
KeepAlive 的 exclude 属性用于明确告诉 Vue：哪些组件不参与缓存。它和 include 是互补关系，但更常用在“默认全缓存、个别不缓存”的场景，比如登录页、表单页、实时数据页等需要每次刷新的组件。
exclude 支持的值类型
exclude 可以接收三种形式的值，Vue 会据此匹配组件名（注意：是组件的 name 选项，不是文件名或路由路径）：
-
字符串：逗号分隔的组件名，如
"Login,SearchForm" -
正则表达式：用
/^Report/匹配所有以 Report 开头的组件名 -
数组：包含字符串或正则的数组，如
['Login', /Detail$/]
在路由场景中排除组件（最常见用法）
通常配合 <router-view> 使用，把 KeepAlive 套在动态组件外层：
<router-view v-slot="{ Component }">
<keep-alive :exclude="['Login', 'Register']">
<component :is="Component" />
</keep-alive>
</router-view>
这样，只要当前渲染的组件 name 是 Login 或 Register，就不会被缓存，每次进入都会重新创建实例。
vue-composition-api-best-practices
下载
Vue 3 组合式 API 与 最佳实践，涵盖代码组织、useXxx 模式、组合式函数设计、Store 集成、响应式优化及功能抽取。
立即学习“前端免费学习笔记（深入）”；
动态控制 exclude（例如退出登录时清缓存）
如果需要在用户登出时让某些页面“强制不缓存”，可把 exclude 绑定为响应式变量：
- 定义一个 ref，比如
const excludeList = ref(['Login']) - 登出时更新它：
excludeList.value = ['Login', 'UserCenter', 'OrderList'] - 模板中写成
:exclude="excludeList"
注意：修改 exclude 不会主动销毁已缓存的实例，但后续切换到被 exclude 的组件时，它将不再进入缓存池；若想彻底清除已有缓存，需配合 max 或手动操作 KeepAlive 实例的 include/exclude 并触发重渲染。
常见误区提醒
组件名必须与 defineComponent({ name: 'xxx' }) 或 export default { name: 'xxx' } 中声明的一致。使用 <script setup> 且未显式声明 name 时，Vue 会自动生成（如文件名为 Home.vue → name 默认为 Home），但建议显式写出，避免歧义。
