Vue框架在项目开发中如何实现组件的复用？

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

目录定义依赖收集依赖触发依赖总结在从vue(v2.7.10)源码分析中，我们讲述了vue是如何收集依赖和触发依赖的。

vue是如何收集依赖的：

1.通过Object.defineProperty()方法，为每个数据属性设置getter和setter。

2.在getter中，添加依赖收集逻辑，即订阅者（watcher）将自己添加到当前属性的依赖列表中。

vue是如何触发依赖的：

1.当数据属性值发生变化时，setter会触发。

2.在setter中，遍历当前属性的依赖列表，并执行每个订阅者的回调函数。

其中computed的实现原理和这个密切相关：

1.computed属性本身就是一个watcher，它在初始化时会收集依赖。

2.当computed属性依赖的数据发生变化时，vue会自动重新计算computed属性的值，并更新DOM。

接下来，我将继续介绍vue的依赖收集和触发依赖的更多细节。

目录

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

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