Actions complexes et asynchrones
Jusque-là, notre manière d’utiliser Redux est restée relativement simple :
-
dans le composant nous dispatchons une action ;
-
l’action passe dans le reducer, qui met à jour le state ;
-
le composant est réaffiché pour tenir compte du nouveau state.
Si ce processus convient déjà à beaucoup de besoins, certains vont nous poser quelques problèmes : comment peut-on indiquer qu’une action doit à son tour dispatcher une autre action ? Comment peut-on faire en sorte qu’une action déclenche une requête HTTP (asynchrone donc) ?
Pour répondre à ces problèmes, il existe une bibliothèque qui va venir se greffer à Redux : Redux-Thunk (https://github.com/reduxjs/redux-thunk). Celle-ci se présente sous forme d’un middleware pour Redux, c’est-à-dire que l’on va indiquer à Redux que l’on souhaite l’utiliser, et cela suffira à ajouter de nouvelles possibilités que nous allons voir. Redux-Thunk
Afin de présenter Redux-Thunk, nous allons créer un chronomètre minimaliste, qui offrira les fonctionnalités suivantes :
-
être démarré, déclenchant ainsi l’affichage du nombre de secondes écoulées à partir de ce moment ;
-
être mis en pause momentanément ;
-
être remis à zéro.
Cet exemple ne pose aucune difficulté technique, d’ailleurs grâce...
Pour consulter la suite, découvrez le livre suivant :
En version papier
En version numérique
En illimité avec l'abonnement ENI
Sur la boutique officielle ENI
Conditions générales d'utilisationCopyright - © Editions ENI ||Politique de protection des données du groupe ENI