watch() — vue Function Reference

Architecture documentation for the watch() function in apiWatch.ts from the vue codebase.

Function typescript VueCore GlobalAPI calls 2 called by 1

Entity Profile

VueCore→ GlobalAPI→ watch() — vue Function Reference

Dependency Diagram

graph TD
  8fa07b52_41f7_9cba_4986_3b311b491283["watch()"]
  e5380f01_49bc_d965_1141_151fb5c6c097["apiWatch.ts"]
  8fa07b52_41f7_9cba_4986_3b311b491283 -->|defined in| e5380f01_49bc_d965_1141_151fb5c6c097
  bfa86000_56fb_9b0f_e681_81fbf55feaec["doWatch()"]
  bfa86000_56fb_9b0f_e681_81fbf55feaec -->|calls| 8fa07b52_41f7_9cba_4986_3b311b491283
  089bdced_38c8_41bb_6c2b_1e392ee69bf4["watchEffect()"]
  8fa07b52_41f7_9cba_4986_3b311b491283 -->|calls| 089bdced_38c8_41bb_6c2b_1e392ee69bf4
  bfa86000_56fb_9b0f_e681_81fbf55feaec["doWatch()"]
  8fa07b52_41f7_9cba_4986_3b311b491283 -->|calls| bfa86000_56fb_9b0f_e681_81fbf55feaec
  style 8fa07b52_41f7_9cba_4986_3b311b491283 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

src/v3/apiWatch.ts lines 139–152

export function watch<T = any, Immediate extends Readonly<boolean> = false>(
  source: T | WatchSource<T>,
  cb: any,
  options?: WatchOptions<Immediate>
): WatchStopHandle {
  if (__DEV__ && typeof cb !== 'function') {
    warn(
      `\`watch(fn, options?)\` signature has been moved to a separate API. ` +
        `Use \`watchEffect(fn, options?)\` instead. \`watch\` now only ` +
        `supports \`watch(source, cb, options?) signature.`
    )
  }
  return doWatch(source as any, cb, options)
}