De hecho, tiene (casi) razón con su suposición.

Hay 2 ventajas principales de this.$watch() .

1. Puedes empezar a mirar dinámicamente
2. el valor de retorno de this.$watch() es una función de desobservación con la que puede detener dinámicamente al observador durante el tiempo de ejecución

Pero eso no significa necesariamente que siempre debas usar this.$watch() over watch: {} . Lo contrario. Siempre debes pensar en lo que necesita tu caso de uso

Unwatch-ejemplo:

 export default { //.. created(props) { const unwatchAge = this.$watch(() => this.user.age, (value, oldValue) => { if (value >= 18) { alert('You are now allowed to drive a car!'); unwatchAge(); //we don't need age watching for anything else } }); } //... }

Por cierto, con VUE3 es posible que desee ver los métodos API de composición watch() / watchEffect() .

watch() hace lo mismo que watch: {} y this.$watch() y también tiene un método unwatch como valor de retorno.

watchEffect() comprueba cualquier valor mencionado dentro del parámetro (función) y pone un observador en él internamente.

watch() Ejemplo (composición)

 import { toRef, watch} from 'vue'; export default { //... setup(props) { const age = toRef(props.age); const unwatchAge = watch(age, console.log); // no () => age or () => age.value needed as age is a reference by using toRef and references can be handles like this setTimeout(() => { console.warn('unwatching age!'); unwatchAge(); }, 5000); } //... }

watchEffect() Ejemplo (composición)

 import { toRef, watchEffect} from 'vue'; export default { //... setup(props) { const age = toRef(props.age); watchEffect(() => { if (age.value >= 18) { alert('You are now allowed to drive a car!'); } }); //vue will internally recognize that age has to be watched here. No telling it manually. } //... }

La principal diferencia con respecto a los documentos es que el instance method devuelve un unwatchable que no se puede ver que puede activar para dejar de ver una determinada propiedad:

 const unwatchUsers = this.$watch('users', () => {}); setTimeout(unwatchUsers, 1000);

Esto no es posible con la API de options . Es extremadamente útil usar este unwatch devuelto por this.$watch cuando algo sucede en su aplicación.

Tenga en cuenta cuál es el más apropiado para su caso de uso y utilícelo en consecuencia