Méthode de récupération
La méthode fetch dans JS est utilisée pour demander au serveur et charger les informations dans les pages Web. La requête peut provenir de n'importe quelle API qui renvoie les données au format #json ou #xml . Cette méthode renvoie une promesse. Jetez un oeil à un exemple. Passons à la méthode suivante
Async-Await
C'est le moyen préféré pour récupérer les données d'une API car il nous permet de supprimer nos rappels .then() et de renvoyer des données résolues de manière asynchrone. Dans le bloc asynchrone, nous pouvons utiliser la fonction Await pour attendre la promesse. Passons à la méthode suivante
Bibliothèque Axios
Avec Axios, nous pouvons facilement envoyer des requêtes HTTP asynchrones aux API REST et aux API REST. effectuer des opérations de création, de lecture, de mise à jour et de suppression. Axios peut être importé en JavaScript brut ou avec n'importe quelle bibliothèque en conséquence. Passons à la méthode suivante
Hooks personnalisés
Il s'agit essentiellement d'un composant React dont le nom commencera par "use" comme useFetch. Il peut utiliser un ou plusieurs hooks React à l’intérieur. Passons à la méthode suivante
Utilisation dans le composant
Importez le hook useFetch et transmettez l'URL du point de terminaison de l'API à partir duquel vous souhaitez récupérer les données. Désormais, comme n'importe quel hook React, nous pouvons directement utiliser notre hook personnalisé pour récupérer les données. Passons à la méthode suivante
Bibliothèque de requêtes React
Grâce à cela, nous pouvons faire bien plus que simplement récupérer des données. Il prend en charge la mise en cache et la prélecture, ce qui a un impact sur l'expérience utilisateur globale en évitant les irrégularités et en garantissant que notre application soit plus rapide.
Aimez, partagez et abonnez-vous #DevTools99 pour en savoir plus vidéos utiles, informations sur les outils et #tutoriels. Merci !