Reduxdagi ikkita asosiy g'oya
Redux kutubxonasini o'rganishni boshlashdan oldin, keling, uning ikkita asosiy g'oyasi bilan tanishamiz. Birinchisi, holatni boshqarish (state management) ga oid g'oya bo'lib, buni Reactdagi oddiy hisoblagich (counter) misolida ko'ramiz:
function Counter() {
// State (Holat)
const [count, setCount] = useState(0)
// Action (Harakat):
function clickHandler() {
setCount(count + 1)
}
// View (Ko'rinish):
return (
<div>
<span>{count}</span>
<button onClick={clickHandler}>+</button>
</div>
)
}
Ushbu kodda biz count o'zgaruvchisi uchun holatni (state) ko'ramiz - bu
hisoblagich uchun haqiqat manbai. Keyin biz
harakat (action) ni ko'ramiz - bu
foydalanuvchi bosganda holatni yangilashni
chaqiradigan hodisa. Va nihoyat,
ko'rinish (view),
uning yordamida biz foydalanuvchi
interfeysini ko'rsatamiz.
Shunday qilib, sxema juda oddiy:
tugma bosiladi - count holati (State)
bosish (Action) natijasida o'zgaradi, shuning uchun
ko'rinish (View) o'zgaradi - bizning holatda
bu ekrandagi raqam.
Biroq, agar bizda bir xil holatdan foydalanishi kerak bo'lgan ko'plab komponentlar bo'lsa, hamma narsa murakkablashadi. Albatta, masalan, holatni yuqoriga ko'tarish (lifting state up) mumkin, lekin bunday yechim har doim ham muammodan xalos bo'lishga yordam bermasligi mumkin. Redux bu holda bizga ilovada global holatni o'z ichiga oladigan bitta joy yaratishni taklif qiladi va bu holatni yangilashda ma'lum xatti-harakatlar shablonlarini. Aynan shunda birinchi asosiy g'oya yotadi (!).
Ikkinchi g'oya immutability (o'zgarmaslik) bilan bog'liq, ya'ni ma'lumotlarning o'zgarmasligi. Siz, albatta, JavaScriptdan eslaysizki, massivlar va ob'ektlarni o'zgartirish mumkin. Ma'lumotlarni to'g'ridan-to'g'ri o'zgartirish Reduxda, boshqa freymvorklardagi kabi, yomon odat hisoblanadi va oldinga aytib bo'lmaydigan oqibatlarga olib kelishi mumkin. Shuning uchun Reduxda bizning dastlabki ob'ektlarimiz va massivlarimiz o'zgarmas (immutable) bo'lib qolishi kerak, o'zgartirish esa faqat ularning nusxalariga tegishli.
Reduxning birinchi asosiy g'oyasi qanday ekanligini tushuntiring.
Reduxning ikkinchi asosiy g'oyasi qanday ekanligini tushuntiring.