前端知库

Vue 3 响应式依赖是怎样收集和触发的?

参考答案

可以把响应式过程理解为:运行副作用时记录当前活跃的作用,读取响应式属性时把它与属性关联,属性发生相关变化时再调度依赖它的作用。对象通常通过 Proxy 拦截,ref 通过值访问封装。

真实实现还要处理分支切换时的旧依赖清理、嵌套作用、数组与集合操作,以及批处理调度。计算属性、侦听器和组件渲染都有各自的调度语义。

不要把“某对象用了 reactive”理解为所有引用路径都自动可追踪。解构原始值、绕过代理修改原对象、错误的 shallow 使用都可能破坏预期。先检查实际读取的是哪个响应式来源,再判断为何没有更新。