VUE 3.0源码之effect

本文详细探讨Vue 3.0中的effect功能,包括effect的创建、createReactiveEffect的运作机制以及track如何收集依赖。通过这些核心概念,深入解析Vue响应式系统的内部工作原理。
摘要由CSDN通过智能技术生成

effect方法主要用于处理函数的响应式,可用于计算属性和watchEffect等功能,通过触发函数中响应式变量的proxyget方法实现将自身加入到proxydeps中,实现与proxy关联,也可以将其他依赖收集到自己的deps中

1. effect

创建一个effect函数,如果不是lazy创建时会先调用一遍,这样可以调用相关get并将effect加入相关proxy的deps中

function effect<T = any>(
  fn: () => T,
  options: ReactiveEffectOptions = EMPTY_OBJ
): ReactiveEffect<T> {
   
  if (isEffect(fn)) {
    // 如果已经是effect则将原函数取出来
    fn = fn.raw
  }
  const effect = createReactiveEffect(fn, options)
  if (!options.lazy) {
    // 如果不是lazy则先调用一遍effect,这个时候可以触发相关proxy的get
    effect()
  }
  return effect
}
2. createReactiveEffect

当调用effect时会创建一个

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值