Reduxда тўғридан-тўғри thunk юбориш

Компонентлардан экшенларни юборганда, биз storeнинг dispatch методини қайтарувчи useDispatch хукидан фойдалангандик, чунки компонентларда storeга тўғридан-тўғри доступ йўқ.

Бу сафар бизга сотилчилар объектларини олиш ва уни иловамиз ишга тушганида бир марта бажариш керак. Биз бу ишни worker ишлашни бошлаганидан сўнг ананa main.jsx илова файлидан бажара оламиз.

Келгинг, махсулотларимиз билан иловани ochамиз, ундаги main.jsx файлини ochамиз ва унга fetchSellers thunkни импорт қиламиз:

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

Бу файлда бизга store мавжуд, шунинг учун бу ерда ҳеч қандай хуклар керак эмас ва biz uning dispatch методидан тўғридан-тўғри фойдаланишимиз мумкин. Келгинг, куйидаги сатрдан сўнг:

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

Куйидагини қўшамиз:

store.dispatch(fetchSellers())

Иловамизни ишга туширамиз. Энди махсулотлар билан карточкаларда сотилчилар ҳам кўрсатилган:

Студентларингиз билан илованингизни ochинг. Ундан main.jsx файлини ochинг. Унга созинг thunk fetchTeachersни импорт қилинг ва уни тўғридан-тўғри store.dispatch методу билан юборинг.