Skip to content

computed 与 watch:派生状态、脏标记与副作用调度

主题边界

  • computedwatch 都建立在 ReactiveEffect 上,但解决的是两类完全不同的问题。
  • computed 负责可缓存的派生状态,watch 负责观察源变化并驱动副作用。

机制与流程

  • computed 内部持有 lazy effect 和 dirty 标记,依赖变化时先置脏,下一次读取时再重新求值。
  • watch 会对 source 建立 effect,变化后调度回调执行;watchEffect 则把依赖收集和副作用执行合在一起。
  • watchflush 时机决定副作用是在渲染前、渲染后还是同步执行。

关键差异

  • computed 应保持纯函数性质,输出只由依赖决定;watch 明确允许请求、订阅、日志等副作用。
  • watch 的 source 可以是 ref、getter、reactive 对象或数组,表达的是“监听范围”;computed 表达的是“值依赖关系”。

边界条件

  • computed 当监听器使用会让依赖关系和副作用边界同时变脏。
  • 深度 watch 有遍历成本;能精确指定 source 时不要直接 deep watch 整棵对象树。

工程落点

  • 优先把可表达为派生值的逻辑收敛到 computed,把 I/O、同步和清理逻辑放进 watch
  • 这一区分能显著降低副作用散落和重复计算问题。

相关主题