為什么使用redux?
由于react是單向數(shù)據(jù)源,數(shù)據(jù)只能一層一層往下傳。假如開(kāi)發(fā)過(guò)程中遇到多個(gè)組件共同使用的一個(gè)屬性(比如在A組件進(jìn)行修改,觸發(fā)B組件頁(yè)面渲染),為了讓A、B組件都能使用這個(gè)屬性,我們就必須把這個(gè)屬性放在A、B組件公共的父組件里面,并且提供修改方法,再通過(guò)props把屬性值和修改方法一級(jí)一級(jí)傳遞到A、B組件里面。假如A、B組件要往上找很多級(jí)才有公共的父組件,那么后期維護(hù)會(huì)非常麻煩,于是就有了redux。我們只需要把這個(gè)屬性交給redux管理,讓redux負(fù)責(zé)這個(gè)屬性的查詢、修改;并對(duì)外提供查詢、修改的方法,那么我們只需要在使用的組件里面引入redux,通過(guò)redux提供的查詢方法(getStore)獲取這個(gè)屬性值,通過(guò)redux提供的修改方法(dispatch發(fā)送一個(gè)action)去修改這個(gè)屬性值,就可以減少一層一層傳遞的過(guò)程,達(dá)到同樣的效果。
由于數(shù)據(jù)通過(guò)redux進(jìn)行了集中管理,方便我們對(duì)數(shù)據(jù)進(jìn)行溯源,更快的定位數(shù)據(jù)相關(guān)的問(wèn)題,可以大大減少維護(hù)難度。
redux剖析:
Redux遵循以下三個(gè)基本原則:
1、整個(gè)應(yīng)用只有唯一一個(gè)可信數(shù)據(jù)源,也就是只有一個(gè) Store
2、Store里面的數(shù)據(jù)(state)只能通過(guò)觸發(fā) Action 來(lái)更改
3、State 的更改必須寫成純函數(shù)(什么是純函數(shù)),也就是每次更改總是返回一個(gè)新的 State,在 Redux 里這種函數(shù)稱為 Reducer
redux核心是一個(gè)Store對(duì)象,通過(guò)這個(gè)對(duì)象存儲(chǔ)數(shù)據(jù)。Store通過(guò)createStore()創(chuàng)建,通過(guò)getStore()獲取。Store對(duì)象包含所有數(shù)據(jù)。如果想得到某個(gè)時(shí)點(diǎn)的數(shù)據(jù),就要對(duì) Store 生成快照。這種時(shí)點(diǎn)的數(shù)據(jù)集合,就叫做 State,一個(gè) State 對(duì)應(yīng)一個(gè) View。Store唯一的數(shù)據(jù)來(lái)源(或者數(shù)據(jù)更新)是發(fā)送一個(gè)action到Reducer里面,Reducer接受舊的state和action,Reducer會(huì)對(duì)他們進(jìn)行合并得到一個(gè)全新的state并返回,通過(guò)這種方式更新store對(duì)象。