Redux - Boutique

Un magasin est une arborescence d'objets immuable dans Redux. Un magasin est un conteneur d'état qui contient l'état de l'application. Redux ne peut avoir qu'un seul magasin dans votre application. Chaque fois qu'un magasin est créé dans Redux, vous devez spécifier le réducteur.

Voyons comment nous pouvons créer un magasin en utilisant le createStoreméthode de Redux. Il faut importer le package createStore à partir de la bibliothèque Redux qui prend en charge le processus de création de magasin comme indiqué ci-dessous -

import { createStore } from 'redux';
import reducer from './reducers/reducer'
const store = createStore(reducer);

Une fonction createStore peut avoir trois arguments. Voici la syntaxe -

createStore(reducer, [preloadedState], [enhancer])

Un réducteur est une fonction qui renvoie l'état suivant de l'application. Un preloadedState est un argument facultatif et correspond à l'état initial de votre application. Un enhancer est également un argument facultatif. Cela vous aidera à améliorer le magasin avec des capacités tierces.

Un magasin a trois méthodes importantes comme indiqué ci-dessous -

getState

Il vous aide à récupérer l'état actuel de votre boutique Redux.

La syntaxe de getState est la suivante -

store.getState()

envoi

Il vous permet d'envoyer une action pour modifier un état dans votre application.

La syntaxe de la répartition est la suivante -

store.dispatch({type:'ITEMS_REQUEST'})

souscrire

Il vous aide à enregistrer un rappel que le magasin Redux appellera lorsqu'une action a été envoyée. Dès que l'état Redux a été mis à jour, la vue sera automatiquement rendue.

La syntaxe de la répartition est la suivante -

store.subscribe(()=>{ console.log(store.getState());})

Notez que la fonction subscribe renvoie une fonction de désabonnement de l'écouteur. Pour désinscrire l'auditeur, nous pouvons utiliser le code ci-dessous -

const unsubscribe = store.subscribe(()=>{console.log(store.getState());});
unsubscribe();