Mostrar detalles de un registro de una API en Vue 3
Comprar curso

52. Mostrar detalles de un registro de una API en Vue 3

En este capítulo se enseña cómo mostrar el detalle de un registro de una API en una vista utilizando Vue 3 y Axios. Se muestra cómo realizar la petición a la API y cómo procesar los datos recibidos para su visualización en una vista de detalle.


3 comentarios

Inicia sesión para comentar

Comentarios:

  • Arcangel

    Arcangel hace 9 meses

    Ola, al final de video, cuando el profesor intenta mostrar una categoría con su respectivo nombre ({{curso.category.name }}), nos bota un error en consola: 

    caught (in promise) TypeError: Cannot read properties of undefined (reading 'name')

    Sin embargo cuando hacemos consulta de la categoría en general, este error desaparece.  ({{curso.category}}) , la explicación de porque pasa esto la encuentras acá. La solución que implementé fue crear una nueva variable en data: 

    detalleCursoCategory: {}

    Y en la función de axios llenarla:

    .then(response=>{
                    this.curso = response.data;
                    this.detalleCursoCategory = this.curso.category
                })

    De esta manera cuando quieras llamar a la categoría del curso, ahora debes acceder a esta nueva variable: 

    {{ detalleCursoCategory.name }}

    De esta manera, ya no tendrías ningún error

    • Bruno Agustín Aguirre Ing.sistemas hace 8 meses

      Excelente Aporte Compañero me funciono 

  • Bleyfer

    Bleyfer hace 1 año

    Hola al agregar included()->findOrFail($id) me saca un error = Call to undefined method App\Models\User::included(), como defino la propiedad included()… utilizando with() me trae la relación – with('category')->findOrFail($id) me trae la misma información. creo que en laravel 9 cambio eso

    • Victor Arana Flores hace 1 año

      Hola, me confunde un poco tu pregunta, porque este es un curso de Vue y no de Laravel ?

  • David Albarran Cortes

    David Albarran Cortes hace 1 año

    seria genial que el repo de la api este disponible

    • Victor Arana Flores hace 1 año

      Hola David, el link del repo lo he dejado anteriormente, pero de todas maneras te paso el link de la cuenta de git hub de coders free para que puedas revisar ese o cualquier otro proyecto que te interese :D
      https://github.com/coders-free?tab=repositories