Vue中computed属性是如何深度运作的？

本文共计1375个文字，预计阅读时间需要6分钟。

目录- 定义- 依赖- 收集依赖- 触发依赖- 总结- 从Vue（v2.7.10）源码分析Vue如何收集和触发依赖

本文中，我们将探讨Vue是如何收集和触发依赖的。Vue如何收集依赖和触发依赖是理解Vue响应式原理的关键。

定义Vue通过Object.defineProperty()来定义数据属性，当访问或修改这些属性时，Vue会收集依赖。

依赖当数据属性被访问时，Vue会创建一个依赖实例，并将该实例存储在属性对应的依赖列表中。

收集依赖当访问或修改数据属性时，Vue会触发getter/setter，从而收集依赖。

触发依赖当数据属性值发生变化时，Vue会遍历依赖列表，并触发所有依赖的更新函数。

总结Vue通过getter/setter机制，实现了响应式依赖收集和触发。

接下来，我将进一步解释computed的实现原理，以及它与依赖收集和触发的密不可分的关系。

目录

• 定义依赖
• 收集依赖
• 触发依赖
• 总结

在从vue(v2.7.10)源码分析vue是如何收集依赖和触发依赖这篇文章中我们讲了vue是怎么收集依赖的。其中computed的实现原理和这个密切相关，接下来我们看看computed的实现原理。