Créer des Composants Vue.js avec Axios

Organiser une application en hiérarchie de composants
Vidéo non disponible ! Réessayez plus tard
Cette vidéo fait partie de la formation
Apprendre Vue JS 3
Revoir le teaser Je m'abonne
Transcription

Cette leçon fait partie de la formation
69,00€ Je commande

Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

DescriptionProgrammeAvis

Cette leçon fait partie de la formation
69,00€ Je commande

Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

L'objectif de cette vidéo est de vous enseigner comment :

  • Utiliser des composants locaux et globaux dans Vue.js.
  • Récupérer et manipuler des données à partir d'une API REST à l'aide d'Axios.
  • Structurer une application Vue.js de manière modulaire et efficace.

Apprenez à manipuler les composants locaux et globaux en utilisant Axios pour récupérer des données d'une API REST avec Vue.js.

Dans cette leçon, vous allez apprendre à créer des composants locaux et globaux avec Vue.js, et à utiliser la bibliothèque Axios pour accéder à une API REST, en récupérant et affichant des données. Nous allons débuter par la récupération de 10 utilisateurs aléatoires à partir de l'API randomuser.me. Ensuite, nous diviserons l'interface en composants pour structurer le code, en utilisant un composant local appelé '1' pour afficher les détails de chaque utilisateur, et un autre appelé 'Tous' pour montrer les 10 utilisateurs en boucle.

Ensuite, vous aurez l'opportunité de transformer ces composants locaux en composants globaux pour une réutilisabilité optimisée dans d'autres parties de l'application. Cette leçon offre une vue pratique et détaillée sur la manière de structurer les applications Vue.js et de gérer les composants de manière efficace.

Voir plus
Questions réponses
Qu'est-ce qu'un composant global dans Vue.js ?
Un composant global dans Vue.js est un composant enregistré dans l'application Vue principale et peut être utilisé dans n'importe quel composant de l'application sans avoir besoin de l'importer ou de le déclarer localement.
Quelle est l'utilité d'Axios dans le projet présenté ?
Axios est utilisé pour effectuer des requêtes HTTP vers une API REST, permettant ainsi de récupérer des données, comme les informations des utilisateurs dans l'exemple, à utiliser dans l'application Vue.js.
Comment transforme-t-on un composant local en composant global ?
Pour transformer un composant local en composant global, on déplace la définition du composant dans le fichier principal de l'application et l'enregistre via la méthode app.component() de Vue, permettant ainsi son usage global.

Programme détaillé