Contenido del curso
Sylvester Josué Rojas Cañón
Maria Tohabanda Duchi
Contenido del curso
Sylvester Josué Rojas Cañón
Maria Tohabanda Duchi
Carlos Perilla
Fernando Jorge Bardelli
Diana Martinez
Víctor Julián González Estrada
Víctor Julián González Estrada
Recomiendo la escuela de English Academy de Platzi para pronunciar correctamente las palabras en inglés.
Router ? :D
Codigo en Nuxt 3:
const { params } = useRoute() const { data: { value: { article } } } = await useAsyncData(() => { const { slug } = params return $fetch(`http://localhost:9999/.netlify/functions/article?slug=${slug}`); }) console.log(article)
Es más funcional, y con funciones integradas en Nuxt
¿Que diferencia habría entre usar AsyncData() y mounted() para cargar los datos de un articulo?
Mounted es un hook del ciclo de vida de los componentes de Vue, eso significa que se ejecuta después de que la página ha cargado en el frontend, ha cargado javascript, y luego se ha montado el componente, por lo que si llamas al API desde ahí, primero cargará tu página vacía, y luego tardará un momento en lo que el backend respone los datos y estos se dibujan.
Mientras tanto, asyncData se asegura de iniciar la petición de datos desde antes de responderle al usuario la página, y para cuándo la página es devuelta al usuario, incluso antes de que carge el javascript, ya vienen los datos que consiguió.
Pues en ayncData la petición al API se hace desde el servidor (o al momento de usar el comando generate para sitios estáticos).
En resumen asyncData te permite que no haya carga inicial con datos vacíos y tiempos de espera del lado del cliente mientras se llenan los datos.
Puedo usar cualquier función del store?, usando asyncData?
Seria así?
asyncData({store}) { code }