Vue JS Vue JS Reactivity System 2

Question 1

What Vue 3 function lets you run a side effect whenever its reactive dependencies change?

Accepted Answer

watchEffect()

Answer

watchEffect() immediately runs a function and automatically re-runs it whenever any reactive dependency accessed inside it changes.

Question 2

What is the key difference between watch() and watchEffect() in Vue 3?

Accepted Answer

watch() requires explicit source declaration; watchEffect() auto-tracks dependencies

Answer

watch() observes specific declared sources and provides old/new values, while watchEffect() auto-collects dependencies at runtime.

Question 3

How do you stop a watcher created inside setup() from running?

Accepted Answer

Call the stop function returned by watch()/watchEffect()

Answer

watch() and watchEffect() both return a stop function that, when called, removes the watcher.

Question 4

Which option in watch() makes it run immediately on component mount in addition to when the source changes?

Accepted Answer

immediate: true

Answer

The immediate: true option causes the watcher callback to execute right away with the current value before any change occurs.

Question 5

What does the deep: true option do in a Vue 3 watch() call?

Accepted Answer

Forces the watcher to track nested object property changes

Answer

deep: true causes Vue to traverse every nested property of the source object so changes at any depth trigger the callback.

Vue JS Practice Test