React學習筆記(四) 資料流

標籤：

Redux 應用中資料的生命週期遵循下面 4 個步驟：

1.調用store.dispatch(action):

　　你可以在任何地方調用store.dispatch(action)，包括組件中、XHR 回調中、甚至定時器中。

 

2.Redux store調用傳入的reducer函數：

　　Store 會把兩個參數傳入 reducer，當前的 state 樹和 action

 

3.reducer應該把多個子reducer輸出合并成一個單一的state樹：

　　Redux 原生提供combineReducers()輔助函數，來把根 reducer 拆分成多個函數，用於分別處理 state 樹的一個分支。　

function todos(state = [], action) {   // 省略處理邏輯...   return nextState; } function visibleTodoFilter(state = ‘SHOW_ALL‘, action) {   // 省略處理邏輯...   return nextState; } let todoApp = combineReducers({   todos,   visibleTodoFilter });

 

4,Redux store 儲存了根 reducer 返回的完整 state 樹:

　　這個新的樹就是應用的下一個 state！所有訂閱store.subscribe(listener)的監聽器都將被調用；監聽器裡可以調用store.getState()獲得當前 state。

 

React學習筆記(四) 資料流