实现effect基本函数-详细步骤

151 阅读1分钟

effect函数的参数是一个函数,这个函数还可以根据状态变化,重新执行,effect可以嵌套着写。

image.png

  • 我们需要把传进来的函数包装一下,让它成为响应式的effect,返回值就是一个响应式的effect

我们就来写这个ReactiveEffect类

首先这个类里要有一个run方法来执行effect

image.png

某些时候可能组件就销毁了,那么我们需要一个标识来表示这个effect是否激活

image.png

当我们调用run的时候

image.png

  • 调用run的时候判断非当前effect是非激活状态,我们只需要执行函数,不需要收集,也就是说如果是非激活状态我们就啥也不做了,直接执行,不做任何处理
  • 如果当前effect是激活状态,我们就要进行依赖收集了。核心就是在fn了进行取值操作的时候获取到这个当前的effect
  • 简而言之就是先把自己暴露在全局上,等一会别人用到这个值了,就可以把这个全局变量把用到的属性关联起来