Redux入門

redux 是 JavaScript 狀態(tài)容器,提供可預(yù)測化的狀態(tài)管理。 可以用在React、Vue等前端庫中。
react-redux是react中的redux插件,簡化了redux的用法,使開發(fā)者更方便地使用redux來管理狀態(tài)。

為什么要有redux?

我們知道,react中的數(shù)據(jù)流是單項傳遞的,即狀態(tài)只能從父組件傳遞給子組件,雖然可以用ref在父調(diào)中調(diào)用子組件的方法從而返回子組件的狀態(tài)給父組件使用、或者使用context跨級傳遞屬性等方法,但是當(dāng)組件很多而且都需要共享一個屬性的時候,那些方法管理屬性就顯得不規(guī)范且不方便,因此,需要使用redux這個專門的狀態(tài)容器來統(tǒng)一管理狀態(tài)。

從執(zhí)行npm start后渲染頁面的角度解釋:

當(dāng)頁面第一次渲染的之前,store.js中的createStore()函數(shù)就根據(jù)參數(shù)reducers創(chuàng)建了store對象,并且reduceers中的默認(rèn)返回值就是store對象需要管理的狀態(tài)以及狀態(tài)初始值。然后頁面調(diào)用getState()獲取到狀態(tài),值獲取完畢后進(jìn)行頁面渲染。當(dāng)用戶點擊按鈕的時候,就會將不同的action傳遞給dispatch,一旦調(diào)用dispatch,就會觸發(fā)reducer中的函數(shù)調(diào)用,改變狀態(tài)之后,將新的狀態(tài)傳遞給store,store接受到新的狀態(tài)之后就會去調(diào)用subscribe中的回調(diào)函數(shù),重新render。

redux的三個關(guān)鍵函數(shù):getState()、subscribe()、dispatch()

getState() :用于獲取當(dāng)前最新的狀態(tài)
subscribe() :用于訂閱監(jiān)聽當(dāng)前狀態(tài)的變化,然后促使頁面重新渲染
dispatch() :用于發(fā)布最新的狀態(tài)

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

友情鏈接更多精彩內(nèi)容