watch() — vue Function Reference

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

Function typescript CompilerSFC TemplateTransformer calls 2 called by 1

Entity Profile

CompilerSFC→ TemplateTransformer→ watch() — vue Function Reference

Dependency Diagram

graph TD
  bb7994e2_ccda_3026_2419_abc4a3c80bfb["watch()"]
  38aa88fe_678d_7728_4258_240bdb85b32b["apiWatch.ts"]
  bb7994e2_ccda_3026_2419_abc4a3c80bfb -->|defined in| 38aa88fe_678d_7728_4258_240bdb85b32b
  1b10e00d_02e6_305e_b4ad_0e11475c3139["doWatch()"]
  1b10e00d_02e6_305e_b4ad_0e11475c3139 -->|calls| bb7994e2_ccda_3026_2419_abc4a3c80bfb
  b8e035ae_6612_326b_69a3_033d12f34655["watchEffect()"]
  bb7994e2_ccda_3026_2419_abc4a3c80bfb -->|calls| b8e035ae_6612_326b_69a3_033d12f34655
  1b10e00d_02e6_305e_b4ad_0e11475c3139["doWatch()"]
  bb7994e2_ccda_3026_2419_abc4a3c80bfb -->|calls| 1b10e00d_02e6_305e_b4ad_0e11475c3139
  style bb7994e2_ccda_3026_2419_abc4a3c80bfb 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)
}