Vue源码学习(十):关于dep和watcher使用的一些思考

好家伙,

 

前面想了好久,都没想明白为什么要dep和watcher打配合才能实现数据-视图同步

为什么要多一个依赖管理这样的东西

给每个数据绑个watcher(xxfunction),然后,数据变了,调set,然后调xxfunction,不就行了,

然后今天突然想明白了,不是为什么要这么干,而是必须这么干

 

来看一个例子,xx汉堡店,胖虎汉堡店

 

蔬菜沙拉的原料只有蔬菜

牛肉汉堡的原材有蔬菜,面包和汉堡肉

现在,我必须紧盯这些食材,材料如果缺货,那么我就无法制作食物并提供给客人了

现在,一旦缺货,我将会触发某些操作,补货

 

这时候我们可以抽象一下他们的依赖关系

Dep(牛肉汉堡){

　　 watcher(蔬菜)

 　　watcher(面包)

　　 watcher(汉堡肉)

}

Dep(蔬菜沙拉){

　　watcher(蔬菜)

}

 

写到这,相信你已经理解dep的作用了

 

我们看到的视图,与我们要操作的数据并不是完全一一对应的,

也许是一对多,也许是多对一,也许是多对多

 

在视图与操作中出现一个中间人,来管理这个依赖关系,就是dep

 

所以总结一下dep的作用是什么?

管理依赖关系