The watcher's source. The source can be one of the following: - A getter function that returns a value - A ref - A reactive object - ...or an array of the above.
The callback that will be called when the source changes. It receives the new and old value(s) as arguments.
Optional
options: UseWatchOptions<Immediate>Allows to control the watch's behaviour.
The hook version of watch
.
This hook version allows the watch to be set up when the component first renders, then automatically stopped when the component unmounts.
You may return a cleanup function from the callback to clean up side effects before the callback re-runs.
Note that this syntax follows that of useEffect
from React, and is not the same as watch
from Vue.
Watches one or more reactive data sources and invokes a callback function when the sources change.
// Inside a function component:
const count = useRef(0)
useWatch(count, (count) => {
console.log(count)
return () => console.log('cleanup')
})
count.value++
The callback that will be called when the source changes. It receives the new and old value(s) as arguments.
Optional
options: UseWatchOptions<Immediate>Allows to control the watch's behaviour.
The hook version of watch
.
This hook version allows the watch to be set up when the component first renders, then automatically stopped when the component unmounts.
You may return a cleanup function from the callback to clean up side effects before the callback re-runs.
Note that this syntax follows that of useEffect
from React, and is not the same as watch
from Vue.
Watches one or more reactive data sources and invokes a callback function when the sources change.
// Inside a function component:
const count = useRef(0)
useWatch(count, (count) => {
console.log(count)
return () => console.log('cleanup')
})
count.value++
The callback that will be called when the source changes. It receives the new and old value(s) as arguments.
Optional
options: UseWatchOptions<Immediate>Allows to control the watch's behaviour.
The hook version of watch
.
This hook version allows the watch to be set up when the component first renders, then automatically stopped when the component unmounts.
You may return a cleanup function from the callback to clean up side effects before the callback re-runs.
Note that this syntax follows that of useEffect
from React, and is not the same as watch
from Vue.
Watches one or more reactive data sources and invokes a callback function when the sources change.
// Inside a function component:
const count = useRef(0)
useWatch(count, (count) => {
console.log(count)
return () => console.log('cleanup')
})
count.value++
The callback that will be called when the source changes. It receives the new and old value(s) as arguments.
Optional
options: UseWatchOptions<Immediate>Allows to control the watch's behaviour.
Generated using TypeDoc
The hook version of
watch
.This hook version allows the watch to be set up when the component first renders, then automatically stopped when the component unmounts.
You may return a cleanup function from the callback to clean up side effects before the callback re-runs. Note that this syntax follows that of
useEffect
from React, and is not the same aswatch
from Vue.Watches one or more reactive data sources and invokes a callback function when the sources change.
Example
See
https://vuejs.org/api/reactivity-core.html#watch