1---
2category: Watch
3---
4 
5# watchDeep
6 
7Shorthand for watching value with `{deep: true}`
8 
9## Usage
10 
11Similar to `watch`, but with `{ deep: true }`
12 
13```ts
14import { watchDeep } from '@vueuse/core'
15 
16const nestedObject = ref({ foo: { bar: { deep: 5 } } })
17 
18watchDeep(nestedObject, (updated) => {
19  console.log(updated)
20})
21 
22onMounted(() => {
23  nestedObject.value.foo.bar.deep = 10
24})
25```
26 
27## Type Declarations
28 
29```ts
30export declare function watchDeep<
31  T extends Readonly<MultiWatchSources>,
32  Immediate extends Readonly<boolean> = false,
33>(
34  source: [...T],
35  cb: WatchCallback<MapSources<T>, MapOldSources<T, Immediate>>,
36  options?: Omit<WatchOptions<Immediate>, "deep">,
37): WatchHandle
38export declare function watchDeep<
39  T,
40  Immediate extends Readonly<boolean> = false,
41>(
42  source: WatchSource<T>,
43  cb: WatchCallback<T, Immediate extends true ? T | undefined : T>,
44  options?: Omit<WatchOptions<Immediate>, "deep">,
45): WatchHandle
46export declare function watchDeep<
47  T extends object,
48  Immediate extends Readonly<boolean> = false,
49>(
50  source: T,
51  cb: WatchCallback<T, Immediate extends true ? T | undefined : T>,
52  options?: Omit<WatchOptions<Immediate>, "deep">,
53): WatchHandle
54```
55