Vue 3 中 watch 和 watchEffect 的依赖收集差异导致回调不触发的问题排查
在 Vue 3 的组合式 API 里,watch 和 watchEffect 是日常开发中处理副作用的两个核心函数。很多人在用 watch 监听一个响应式对象里的某个嵌套属性时,发现回调莫名其妙不执行;或者用 watchEffect 时,以为它追踪了某个变量,实际却没有触发重新运行。这类问题通常源于对两者依赖收集机制的理解偏差:watch 默认只做浅层监听,需要手动指定 deep 或 getter 函数;而 watchEffect 的依赖是在首次执行时同步收集的,任何异步逻辑中访问的响应式数据都不会被追踪。这篇文章从一个真实的表单草稿保存场景出发,梳理 watch 与 watchEffect ...