Vue 3 中 watch 和 watchEffect 的清理副作用到底该怎么做
在 Vue 3 的组合式 API 里,watch 和 watchEffect 是处理响应式副作用的常用手段,但很多人只会在回调里发请求、开定时器、注册事件监听,却忽略了组件卸载或依赖再次变化时如何把这些副作用清理干净。结果就是请求竞态、内存泄漏、重复监听、控制台报错等问题频繁出现。典型场景是搜索框输入时实时请求接口,旧请求返回晚于新请求,页面显示的是过期数据;或者在 watchEffect 里创建了 setInterval,组件销毁后定时器还在跑。Vue 3 为这两个 API 提供了明确的副作用清理机制,包括回调参数 onCleanup 以及 onWatcherCleanup 函数,配合 Ab...