Envoi direct d'un thunk dans Redux

Lorsque nous envoyions des actions depuis les composants, nous utilisions le hook useDispatch, qui retourne la méthode dispatch du store, car les composants n'ont pas d'accès direct au store.

Cette fois, nous devons obtenir les objets des vendeurs et le faire une seule fois au démarrage de notre application. Nous pouvons le faire directement depuis le fichier principal main.jsx de l'application, après que le worker ait commencé à fonctionner.

Ouvrons notre application avec les produits, et dans celle-ci le fichier main.jsx et importons-y le thunk fetchSellers :

import { fetchSellers } from './parts/sellers/sellersSlice'

Dans ce fichier, nous avons accès au store, donc aucun hook n'est nécessaire ici et nous pouvons utiliser directement sa méthode dispatch. Ajoutons après la ligne :

await worker.start({ onUnhandledRequest: 'bypass' })

La ligne suivante :

store.dispatch(fetchSellers())

Lançons notre application. Maintenant, les vendeurs sont également indiqués dans les cartes des produits :

Ouvrez votre application avec les étudiants. Ouvrez-y le fichier main.jsx. Importez-y votre thunk fetchTeachers et envoyez-le directement via la méthode store.dispatch.