geeeger / blog

https://loofp.com
1 stars 0 forks source link

@vue/reactivity 模块浅析 #26

Open geeeger opened 3 years ago

geeeger commented 3 years ago

如下

geeeger commented 3 years ago

发展历程: vue state -> vue reactive object -> vue3 @vue/reactivity模块 原理: 对象代理 依赖收集 如何进行依赖收集: 1.使用effect函数生成reactiveEffect 函数 2.该reactiveEffect函数在执行期间会收集依赖 3.收集依赖的原理是,在effect执行期间,如果在函数中访问代理对象(调用了代理对象的get),代理对象将会使用track api,上报本身为当前effect的依赖, 4.修改代理对象props(实际调用了set), set描述器会调用trigger api,遍历依赖了该对象的effect, 执行effect 所以需要得知: effect要起效,至少要执行一次, 依赖要绑定成功effect,必须出现在effect函数里