Cuente sobre el ciclo de vida de un componente Vue.

El ciclo de vida de un componente Vue es la secuencia de etapas que atraviesa desde su creación hasta su destrucción. Las principales etapas del ciclo de vida y los hooks correspondientes:

1. Creación (Creation)

   • beforeCreate — inicialización, datos y eventos aún no disponibles.
   • created — los datos y métodos ya están disponibles, pero el DOM aún no está montado.

2. Montaje (Mounting)

   • beforeMount — antes de montar en el DOM.
   • mounted — el componente está montado, se puede trabajar con el DOM.

3. Actualización (Updating)

   • beforeUpdate — antes de actualizar los datos y volver a renderizar.
   • updated — después de actualizar el DOM.

4. Desmontaje (Unmounting)

   • beforeUnmount — antes de eliminar el componente.
   • unmounted — después de eliminar el componente del DOM.

Estos hooks permiten ejecutar código en momentos específicos, por ejemplo, inicializar datos, suscribirse a eventos, liberar recursos.

Ejemplo de uso de un hook:

export default {
  mounted() {
    console.log('El componente ha sido montado');
  },
  beforeUnmount() {
    console.log('El componente será eliminado');
  }
}