动态路由配合KeepAlive缓存需三点：组件显式声明唯一name；router-view用:key（如$router.fullPath）隔离实例；KeepAlive通过include精确指定缓存组件名。
动态路由配合 KeepAlive 缓存动态加载的组件，关键在于两点：一是让每个参数不同但组件相同的路由（比如 /user/1 和 /user/2）被识别为独立实例；二是确保组件能被 KeepAlive 正确识别并纳入缓存池。缺一不可。
组件必须有稳定且唯一的 name
动态路由通常复用同一个组件文件（如 UserDetail.vue），但 KeepAlive 不认路径或路由名，只认组件自身的 name 选项。
- 在组件中显式声明
name: 'UserDetail'，不能依赖文件名自动推导（尤其异步加载时容易失效） - name 必须是字符串字面量，大小写敏感，和
include列表中的值完全一致 - 避免使用计算属性或变量生成 name，否则可能在 HMR 或 SSR 场景下不一致
用 :key 强制区分不同参数的实例
仅靠 name 不够——KeepAlive 会把所有 /user/:id 当作同一组件处理，导致状态互相覆盖。必须通过 router-view 的 :key 触发实例隔离。
Springboot Vue Builder
下载
从零开始编排 SpringBoot+Vue 全栈项目工作流，适用于新建全栈项目或完整脚手架请求，触发后依次调用 product‑spec‑builder（需求调研）等模块。
- 推荐写法：
<router-view :key="$route.fullPath"></router-view>（简单可靠，含查询参数） - 更精准写法：
:key="$route.name + '-' + $route.params.id"（适合多路由共用同一组件名的场景） - 禁止用
$route.params对象本身作 key，因为它是响应式对象，引用不变，无法触发重渲染
用 include 精确控制缓存范围
KeepAlive 默认不缓存任何组件，必须通过 include 显式放行。动态加载的组件也不例外。
立即学习“前端免费学习笔记（深入）”；
- 在布局中包裹：
<keep-alive :include="['UserDetail', 'OrderForm']"><router-view></router-view></keep-alive> - 不建议用正则或通配符（如
include="User*"），易误匹配或漏匹配 - 若需运行时增删缓存，可绑定响应式数组（如
cachedViews），配合路由守卫动态维护
配合 activated/deactivated 做状态微调
缓存后组件不再走 created/mounted，但常需在激活/失活时做轻量操作。
-
activated中可恢复滚动位置、检查数据是否过期、重启定时器 -
deactivated中应清除定时器、暂停轮询、保存临时编辑内容到localStorage - 避免在
activated里无条件重新拉取全部数据，违背缓存本意
