vue2源码依赖收集，一个属性什么情况下会收集多个 Watcher？

Question

vue2 在 defineProperty 的 getter 中为属性收集依赖，也就是使用观察者系统 Dep 收集 Watcher，我的问题是，一个属性不是只依赖一个 Watcher 吗？ 在什么场景下会依赖多个 watcher 呢？？ 能写个场景例子吗？

Answer 1

不是只依赖一个 Watcher ，是相同的Watcher只依赖一次

属性是在使用的时候收集依赖的

比如属性a写在template中的，并且被使用了两次，那么两次获取a值的过程都会收集template对应的render-watcher（暂时记为watcher1），但是第二次会判断依赖列表已经有这个watcher1了，所以不会加入依赖列表中

属性a又在computed中被属性b使用两次，两次获取a值的过程也会收集computed：b对应的computed-watcher（暂时记为watcher2），第一次判断依赖列表中没有这个watcher2，加入依赖列表，第二次会判断已经有这个watcher2了，所以不会加入依赖列表中

属性a又在computed中被属性c使用一次，获取a值的过程也会收集computed：c对应的computed-watcher（暂时记为watcher3），判断依赖列表中没有这个watcher3，加入依赖列表

等等