Funciones para acceder al ciclo de vida de un componente - Tutorial de Vue

Te voy a explicar cómo acceder a las diferentes fases del ciclo de vida de un componente con el Composition API. Como podemos recordar, el Composition API funciona muy similar al API al que nosotros estamos acostumbrados en Vue. Si puedes recordar, en Vue para nosotros poder acceder a las diferentes fases del ciclo de un componente es a través de las propiedades 'mounted' o 'created' y demás. Con el Composition API hay que recordar que la mayoría de estas propiedades han sido cambiadas a funciones y esto sucede también con las propiedades para acceder a las diferentes fases de un componente. Aquí yo te tengo un ejemplo. En esta pequeña aplicación lo que hace es que genera elementos HTML aleatoriamente a través de la página y luego, utilizando estos controles, yo cambio las propiedades de estos elementos, como puedes ver aquí. La función 'setup' corre antes de que el componente haya sido montado en la página. Esto significa que estos elementos no están disponibles dentro de la función 'setup'. Para poder acceder a ellos hay que utilizar alguna de las funciones para acceder al ciclo del componente. En este caso yo he elegido la función 'unmounted', ya que esto indica que el componente ya está presente en la página. Luego de que el componente ha sido montado, yo tengo la certeza que los elementos HTML han sido rendereados en la página. Si te vas al "template", puedes notar que yo tengo un 'for' para crear cada uno de estos elementos. Entonces, cuando la función 'unmounted' corre, estos elementos ya han sido creados y agregados a la página. Esto significa que yo puedo crear la animación, o sea, aplicar los colores y tamaño que me están devolviendo estas propiedades. Esta función puedes notar que yo la estoy importando desde la librería de Vue. Entonces, si yo quisiera acceder algún otro método para acceder a los ciclos del componente, también tendría que importarlos de la misma manera. Espero que esto te haya ayudado a entender cómo utilizar el Composition API para acceder a los diferentes ciclos del componente.