Απευθείας Αποστολή Thunk στο Redux

Όταν στέλναμε ενέργειες από τα components, χρησιμοποιούσαμε το hook useDispatch, που επιστρέφει τη μέθοδο dispatch του store, αφού στα components δεν υπάρχει απευθείας πρόσβαση στο store.

Αυτή τη φορά, πρέπει να λάβουμε τα αντικείμενα με τους πωλητές και να το κάνουμε μία φορά κατά την εκκίνηση της εφαρμογής μας. Μπορούμε να το κάνουμε αυτό απευθείας από το κύριο αρχείο main.jsx της εφαρμογής, αφού ο worker αρχίσει να λειτουργεί.

Ας ανοίξουμε την εφαρμογή μας με προϊόντα, και σε αυτή το αρχείο main.jsx και να εισάγουμε σε αυτό το thunk fetchSellers:

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

Σε αυτό το αρχείο, το store είναι διαθέσιμο, οπότε δεν χρειάζονται hooks εδώ και μπορούμε απευθείας να χρησιμοποιήσουμε τη μέθοδο dispatch του. Ας προσθέσουμε μετά από τη γραμμή:

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

Την ακόλουθη:

store.dispatch(fetchSellers())

Ας εκκινήσουμε την εφαρμογή μας. Τώρα στις κάρτες με τα προϊόντα αναγράφονται και οι πωλητές:

Ανοίξτε την εφαρμογή σας με τους φοιτητές. Ανοίξτε σε αυτή το αρχείο main.jsx. Εισάγετε σε αυτό το thunk σας fetchTeachers και στείλτε το απευθείας με τη μέθοδο store.dispatch.