Documentación describe el Vue.js created
y mounted
eventos de la siguiente manera:
created
Se llama sincrónicamente después de crear la instancia. En esta etapa, la instancia ha terminado de procesar las opciones, lo que significa que se ha configurado lo siguiente: observación de datos, propiedades calculadas, métodos, devoluciones de llamada de observación / evento. Sin embargo, la fase de montaje no se ha iniciado y la propiedad $ el aún no estará disponible.
mounted
Se invoca después de que se haya montado la instancia donde el se reemplaza por el vm. $ El recién creado. Si la instancia raíz está montada en un elemento en el documento, vm. $ El también estará en el documento cuando se llame montado.
Este enlace no se llama durante la representación del lado del servidor.
Entiendo la teoría, pero tengo 2 preguntas con respecto a la práctica:
- ¿Hay algún caso en el
created
que se usaríamounted
? - ¿Para qué puedo usar el
created
evento en una situación de la vida real (código real)?
fuente
created
se llama anteriormente, por lo que tiene sentido activar la recuperación de datos desde el back-end de la API, por ejemplo.created()
para despachar acciones para llamadas de API.Respuestas:
created()
: dado que el procesamiento de las opciones ha finalizado, tiene acceso adata
propiedades reactivas y cámbielas si lo desea. En este momento, DOM no se ha montado ni agregado todavía. Entonces no puedes hacer ninguna manipulación DOM aquímounted()
: se llama después de que se haya montado o representado el DOM. Aquí tiene acceso a los elementos DOM y la manipulación DOM se puede realizar, por ejemplo, obtenga el innerHTML:Entonces tus preguntas:
Is there any case where created would be used over mounted?
Created se usa generalmente para obtener datos de la API de back-end y configurarlo en propiedades de datos. Pero en SSR
mounted()
hook no está presente, debe realizar tareas como recuperar datos solo en hook creadoWhat can I use the created event for, in real-life (real-code) situation?
Para recuperar cualquier dato inicial requerido que se representará (como JSON) desde una API externa y asignarlo a cualquier propiedad de datos reactivos
fuente