Vue 3 的 reactive 对象为什么在 watch 里丢失响应式?
在 Vue 3 项目里做数据监听时,我遇到过好几次这样的现象:用 reactive 定义一个嵌套对象,通过 watch 监听它内部的某个属性,修改这个属性后页面更新了,但 watch 回调不执行;或者把 reactive 对象的某个属性解构出来传给子组件,子组件里修改后父组件的 watch 捕获不到变化。排查一圈发现,问题往往出在响应式对象的引用被替换、属性被解构,或者 watch 的监听源写成了普通值。reactive 的响应式依赖的是 Proxy 代理,一旦脱离原始代理对象,响应式就会断开。这篇文章会从 reactive 的代理机制讲起,结合 watch 的源码行为,分析常见断链场景,并给...