KeepAlive 缓存组件需通过路由参数变化、activated 钩子条件刷新或 provide/inject 传递刷新指令来实现“伪刷新”；推荐用 query 时间戳配合 watch 或 router.replace，避免 key 强刷导致缓存失效。
KeepAlive 缓存的数据不会自动更新，页面复用时仍显示旧内容。想让缓存组件“看起来像刷新了”，核心思路是：**不破坏 KeepAlive，但让组件内部响应变化、重新拉取数据**。路由参数（尤其是 query 或 params）是最常用、最可控的触发点。
利用路由参数变化触发组件重载逻辑
Vue 的 keep-alive 会缓存组件实例，但 watch $route 或 onBeforeRouteUpdate 依然有效。只要路由参数（如 id、tab、timestamp）变了，你就可以在这些钩子里主动刷新数据。
- 在 setup 或 beforeRouteUpdate 中监听 route.params.id 或 route.query.t，一旦变化就调用 api 获取新数据
- 避免直接用 key 强制重渲染（如
<keep-alive><xxx :key="$route.fullPath"></xxx></keep-alive>），这会让 KeepAlive 失效，失去缓存意义 - 推荐用 query 参数（如
?t=1715234890）配合时间戳或版本号，语义清晰且不影响路由匹配
配合 activated 钩子做「条件性刷新」
KeepAlive 组件激活时会触发 activated 钩子。它比 mounted 更适合处理缓存场景下的数据同步——因为 mounted 只执行一次，而 activated 每次从缓存中唤醒都会执行。
Skill Weave Chains — 技能链路由引擎
下载
开箱即用的技能链路由引擎。13 条预定义链覆盖搜索、开发、审查、MLOps、法律、创意等场景，三层路由架构（触发词→SAD反馈→DAG编排），recall@10=96.97%。配置驱动（chains.yaml），零代码扩展。pip install skill-weave-chains 一键安装。
- 在 activated 中判断是否需要刷新：比如检查当前路由参数是否和上次缓存时不同，或判断数据是否过期（如缓存时间 > 30s）
- 结合 this.$route 和组件内维护的 lastRoute 对象对比，避免重复请求
- 注意：不要在 activated 里无条件发请求，否则每次切换回来都刷，失去缓存价值
用 provide / inject 实现跨层级「刷新指令」
当多个嵌套的 KeepAlive 子组件都需要响应同一事件（比如用户点击「刷新列表」按钮），可借助 provide/inject + event bus 或 ref 响应式对象，避免层层 props 透传。
- 父级 provide 一个 refreshKey ref（如
ref(0)），子组件 inject 并 watch 它 - 点击刷新按钮时只执行
refreshKey.value++，所有监听它的子组件就会触发重新 fetch - 这个方案和路由解耦，适合非导航触发的更新场景，也兼容 KeepAlive
小技巧：query 参数 + router.replace 避免历史栈污染
如果只是想「视觉上刷新」当前页（比如下拉刷新），可以动态加一个带时间戳的 query，再用 router.replace 替换当前记录，不新增历史项。
- 例如：
this.$router.replace({ query: { ...this.$route.query, t: Date.now() } }) - 配合 watch: { '$route.query.t': { handler() { this.fetchData() }, immediate: true } }
- 用户点浏览器后退时，仍回到原地址（t 参数被 replace 掉了），体验更自然
