Requêtes Ajax et cycle de vie des composants React Ajax

Jusque-là, nous n’avons gardé nos tâches que dans le state local. Nous allons voir dans cette section comment aller récupérer les tâches depuis une API externe. L’appel Ajax n’aura en fait rien à voir avec React, nous allons utiliser la fonction fetch désormais disponible sur tous les navigateurs récents. En revanche, il est pratique de savoir comment gérer cela au mieux avec un composant React. fetch

Pour notre exemple, nous allons récupérer la liste de tâches depuis une API rendue disponible par JSON Placeholder (https://jsonplaceholder.typicode.com).

Celle-ci met simplement à disposition des ressources via une API REST, idéale pour tester des appels Ajax. L’URL que nous allons utiliser est la suivante : https://jsonplaceholder.typicode.com/users/10/todos

Celle-ci nous renvoie un résultat au format JSON : JSON

[ 
 { 
   "userId": 10, 
   "id": 181, 
   "title": "ut cupiditate sequi aliquam fuga maiores", 
   "completed": false 
 }, 
 { 
   "userId": 10, 
   "id": 182, 
   "title": "inventore saepe cumque et aut illum enim", 
   "completed": true 
 } 
] 

La question est de savoir où dans notre application nous allons...

Pour consulter la suite, découvrez le livre suivant :
couv_EIREA.png
60-signet.svg
En version papier
20-ecran_lettre.svg
En version numérique
41-logo_abonnement.svg
En illimité avec l'abonnement ENI
130-boutique.svg
Sur la boutique officielle ENI
Précédent
Réagir aux actions et entrées de l’utilisateur
Suivant
Simplifier les composants grâce aux hooks