Différences entre watch et watchEffect en Vue.js

watch et watchEffect permettent tous deux d’effectuer des side effects. Quelles sont leurs différences ?

Ils réagissent à un changement d’état de variables réactives mais:

➝ watch ne suit que le changement d’état de la valeur qu’il suit: il ne réagit pas aux changements d’état des autres variables utilisées dans le callback.

➝ watchEffect réagit à tout changement d’état de propriétés réactives utilisées lors de son exécution synchrone (toutes les variables réactives utilisées avant le premier tick await). Le code résultant est plus concis mais rend ses dépendances réactives moins explicites. Avec watchEffect donc, pas besoin de maintenir manuellement une longue liste de dépendances. Pas besoin non plus de { immediate: true } pour le lancer immédiatement.