Watch

Código de la clase:

<template>
  <h1>{{ text }}</h1>
  <h2>{{ counter }}</h2>
</template>

<script>
import { ref, watch } from "vue"

export default {
  setup() {
    const text = ref('Hello World')
    const counter = ref(0)

    text.value = 'Hello Vue!'

    setInterval(() => {
      counter.value++
    }, 1500)

    watch(counter, (newValue, oldValue) => {
      console.log(`old: ${oldValue} - new: ${newValue}`)
    })

    return {
      text,
      counter,
    }
  }
}
</script>

Resume de composition Api: lo mismo que option Api pero mas dificil 😅, ojala no se vuelva el estandar.

Me estoy enamorando de Vue! La profe es excelente!

seria bueno que la profe dejara la documentacion de vue que utiliza en las clases, para profundizar mas en algunos temas.

Watch recibe dos params: el valor que quiero escuchar, la function que va a ejecutar cada vez que haya un cambio.

La function a su vez, recibirá dos argumentos: el valor nuevo y el valor anterior

watch(obj, (valor_nuevo, valor_anterior ) => {
	console.log();
}

Mucho ojo con el uso de ref y reactive jajajjaa créanme cuando les digo que eso da una mano de dolores de cabeza cuando te estás acostumbrando, porque el tema del .value o que no tome el valor de la variable es una joda.