Vue-源码知识-Vue3-响应式-watch

2023/4/25 Vue

# 简介

创建 ReactiveEffect 实例,然后根据 option 判断是否执行 run 函数

# 过程

  • 先会判断是 ref 或 reactive 类型,因为取值方式不同,如果是 reactive,option 中的 deep 默认是 true
  • 中间会生成调度器,这个调度器会生成一个 promise 的任务队列,每一项就是 job,这个 job 本质上就是 watch 上的回调函数
  • 注意:如果依赖中存在调度器会优先执行,然后再执行 run 函数,这点和 computed 是一样的
  • 依赖收集是 watch 内部自己主动循环传入的依赖(即第一个参数)进行触发的,和其他的 getter 行为不一样
  • 内部通过异步队列进行执行

# 调度器

  • 在 computed 和 watch 中都有涉及到调度器的概念
  • 调度器主要作用分为两个
    • 控制执行顺序,主要是 effect 中判断了有调度器则优先执行
    • 控制执行规则,主要是通过 promise 创建了异步队列进行控制
Last Updated: 2025/3/27 15:56:10
    飘向北方
    那吾克热-NW,尤长靖