Redux иложения иши тартиби муҳокамаси

Олдинги дарсларда биз Redux иложенияси ишлаши учун зарур бўлган барча таркибий қисмларни амалга оширдик. Келинг, хулоса чиқариб, бизнинг продуктлар билан ишлайдиган иложениямизнинг асосий босқичлари бўйича қисқача йўл кўрайлик.

Биринчи ишга туширилганда, бизнинг иложениямиз useSelector ёрдамиги store-дан иккита продуктдан иборат рўйхатни олади ва уларни экранда кўрсатади. Экранда шунингдек, биз янги продукт маълумотларини киритишимиз мумкин бўлган шакл ҳам кўринишида. Фойдаланувчи сақлаш тугмасини босганда, тугманинг ишловчиси фойдаланувчи томонидан шаклга киритилган янги продукт маълумотларини ўз ичига олган productAdded экшенни жўнатади. Биз продуктлар слайси учун ёзган функция-редьюсер, бу action-ни қабул қилиб, продуктлар массивига янги продукт билан объектни қўшади. Store state-да сақланган маълумотлар ўзгаргани ҳақида компонентларга хабар беради. Бизнинг ProductsList компонентимиз ўзгарган массивни ўқийди, рендерингни чақиради, натижада биз продуктлар рўйхатида қўшилган продуктни кўрамиз.

Энди браузердаги Redux DevTools-ни очамиз ва иложенияга янги бир продукт қўшамиз, сўнгра Log monitor-нинг варақасига қараймиз, бу ерда биз иложения ишга тушган пайтда state-имиз қандай эдилигини ва кейин, сақлаш тугмаси босиллишидан сўнг, action қандай пайдо бўлганини кўришимиз мумкин. Биз унинг payload хусусиятини ва глобал стейтдаги ўзгаришларни кўришимиз мумкин.

Кейинги бобда биз Redux иложениямиздаги маълумотлар билан янгидан иш корамиз.