Redux
August 13, 2022

Reduxda reducer funksiyasi

Yuqoridagi rasmda reduxning ishlash prinsipi nimalarga asoslangani ko'rsatilgan. Ushbu sxemada store nomli box ichida bitta state va bitta reducer nomli funkisya mavjud.

Storedagi state UI(User interface)ga uzatiladi. UI dagi har qanday component bu stateni qabul qila oladi, ya'ni biz faqatgina kerakli componentda stateni olib ishlata olamiz.

Keling endi tartib bilan o'rganishga kirishamiz. Reducer funksiyasi nima va u qanday ishlaydi?

Reducer state o'zgarishini ta'minlab beruvchi funksiya hisoblanadi. Ushbu funksiya o'zida 2 ta parametr saqlaydi bular state va action.

Quyidagi berilgan kodda biz reducer funksiyasini qanday ishlashini ko'rib o'tamiz.

  1. Qiymati 0 ga teng bo'lgan state yozamiz.
  2. Reducer nomli funkisya e'lon qilamiz va u o'zida 2 ta state va action nomli parametr saqlaydi.
  3. Action ham o'zida 2ta xossa saqlaydi bular type va payload. Type xossasi o'zida string qiymat qabul qiladi. Payload bilan esa keyinroq.
  4. Distruktizatsiya yordamida state nomli o'zgaruvchiga reducer funksiyamizning parametrlarini yozamiz. Strelkalar bilan ko'rsatib qo'yilgan
    state = initialState,
    action = action.type = "INCREMENT

Reducer funksiyamiz ishga tushganda actionning type xossasi olgan qiymat bo'yicha tekshirib statening holatini belgilaydi. Bunda action.type === "INCREMENT" bo'lganda state o'zining avvalgi qiymatini bittaga oshirib boradi. Boshqa har qanday holda state dastlabki qiymati ya'ni 0 ni qaytaradi.

Shunday qilib storedagi reducer funksiyamiz action bilan birgalikda satatening qiymatini qanday qilib o'zgartirishini bilib oldik. Keyingi maqolalarda reduxning qolgan funksiyalari haqida to'xtalib chiqamiz inshaalloh.