Store

Store

Store 就是用來維持應(yīng)用所有的 state 樹 的一個(gè)對(duì)象。
改變 store 內(nèi) state 的惟一途徑是對(duì)它 dispatch 一個(gè) action。

Store 不是類。它只是有幾個(gè)方法的對(duì)象。
要?jiǎng)?chuàng)建它，只需要把根部的 reducing 函數(shù) 傳遞給 createStore。

Flux 用戶使用注意

如果你以前使用 Flux，那么你只需要注意一個(gè)重要的區(qū)別。Redux 沒有 Dispatcher 且不支持多個(gè) store。相反，只有一個(gè)單一的 store 和一個(gè)根級(jí)的 reduce 函數(shù)（reducer）。隨著應(yīng)用不斷變大，你應(yīng)該把根級(jí)的 reducer 拆成多個(gè)小的 reducers，分別獨(dú)立地操作 state 樹的不同部分，而不是添加新的 stores。這就像一個(gè) React 應(yīng)用只有一個(gè)根級(jí)的組件，這個(gè)根組件又由很多小組件構(gòu)成。

Store 方法

• getState()
• dispatch(action)
• subscribe(listener)
• replaceReducer(nextReducer)

Store 方法

getState()

返回應(yīng)用當(dāng)前的 state 樹。
它與 store 的最后一個(gè) reducer 返回值相同。

返回值

(any): 應(yīng)用當(dāng)前的 state 樹。

dispatch(action)

分發(fā) action。這是觸發(fā) state 變化的惟一途徑。

會(huì)使用當(dāng)前 getState() 的結(jié)果和傳入的 action 以同步方式的調(diào)用 store 的 reduce 函數(shù)。返回值會(huì)被作為下一個(gè) state。從現(xiàn)在開始，這就成為了 getState() 的返回值，同時(shí)變化監(jiān)聽器(change listener)會(huì)被觸發(fā)。

Flux 用戶使用注意

當(dāng)你在 reducer 內(nèi)部調(diào)用 dispatch 時(shí)，將會(huì)拋出錯(cuò)誤提示“Reducers may not dispatch actions.（Reducer 內(nèi)不能 dispatch action）”。這就相當(dāng)于 Flux 里的 “Cannot dispatch in a middle of dispatch（dispatch 過程中不能再 dispatch）”，但并不會(huì)引起對(duì)應(yīng)的錯(cuò)誤。在 Flux 里，當(dāng) Store 處理 action 和觸發(fā) update 事件時(shí)，dispatch 是禁止的。這個(gè)限制并不好，因?yàn)樗拗屏瞬荒茉谏芷诨卣{(diào)里 dispatch action，還有其它一些本來很正常的地方。

在 Redux 里，只會(huì)在根 reducer 返回新 state 結(jié)束后再會(huì)調(diào)用事件監(jiān)聽器，因此，你可以在事件監(jiān)聽器里再做 dispatch。惟一使你不能在 reducer 中途 dispatch 的原因是要確保 reducer 沒有副作用。如果 action 處理會(huì)產(chǎn)生副作用，正確的做法是使用異步 action 創(chuàng)建函數(shù)。

參數(shù)

1. action (Object?): 描述應(yīng)用變化的普通對(duì)象。Action 是把數(shù)據(jù)傳入 store 的惟一途徑，所以任何數(shù)據(jù)，無論來自 UI 事件，網(wǎng)絡(luò)回調(diào)或者是其它資源如 WebSockets，最終都應(yīng)該以 action 的形式被 dispatch。按照約定，action 具有 type 字段來表示它的類型。type 也可被定義為常量或者是從其它模塊引入。最好使用字符串，而不是 Symbols 作為 action，因?yàn)樽址强梢员恍蛄谢?。除?type 字段外，action 對(duì)象的結(jié)構(gòu)完全取決于你。參照 Flux 標(biāo)準(zhǔn) Action 獲取如何組織 action 的建議。

返回值

(Object?): 要 dispatch 的 action。

注意

? 使用 createStore 創(chuàng)建的 “純正” store 只支持普通對(duì)象類型的 action，而且會(huì)立即傳到 reducer 來執(zhí)行。

但是，如果你用 applyMiddleware 來套住 createStore 時(shí)，middleware 可以修改 action 的執(zhí)行，并支持執(zhí)行 dispatch intent（意圖）。Intent 一般是異步操作如 Promise、Observable 或者 Thunk。

Middleware 是由社區(qū)創(chuàng)建，并不會(huì)同 Redux 一起發(fā)行。你需要手動(dòng)安裝 redux-thunk 或者 redux-promise 庫(kù)。你也可以創(chuàng)建自己的 middleware。

想學(xué)習(xí)如何描述異步 API 調(diào)用？看一下 action 創(chuàng)建函數(shù)里當(dāng)前的 state，執(zhí)行一個(gè)有副作用的操作，或者以鏈?zhǔn)讲僮鲌?zhí)行它們，參照 applyMiddleware 中的示例。

示例

import { createStore } from 'redux';
let store = createStore(todos, ['Use Redux']);

function addTodo(text) {
  return {
    type: 'ADD_TODO',
    text
  };
}

store.dispatch(addTodo('Read the docs'));
store.dispatch(addTodo('Read about the middleware'));

subscribe(listener)

添加一個(gè)變化監(jiān)聽器。每當(dāng) dispatch action 的時(shí)候就會(huì)執(zhí)行，state 樹中的一部分可能已經(jīng)變化。你可以在回調(diào)函數(shù)里調(diào)用 getState() 來拿到當(dāng)前 state。

這是一個(gè)底層 API。多數(shù)情況下，你不會(huì)直接使用它，會(huì)使用一些 React（或其它庫(kù)）的綁定。如果你想讓回調(diào)函數(shù)執(zhí)行的時(shí)候使用當(dāng)前的 state，你可以 把 store 轉(zhuǎn)換成一個(gè) Observable 或者寫一個(gè)定制的 observeStore 工具。

如果需要解綁這個(gè)變化監(jiān)聽器，執(zhí)行 subscribe 返回的函數(shù)即可。

參數(shù)

1. listener (Function): 每當(dāng) dispatch action 的時(shí)候都會(huì)執(zhí)行的回調(diào)。state 樹中的一部分可能已經(jīng)變化。你可以在回調(diào)函數(shù)里調(diào)用 getState() 來拿到當(dāng)前 state。store 的 reducer 應(yīng)該是純函數(shù)，因此你可能需要對(duì) state 樹中的引用做深度比較來確定它的值是否有變化。

返回值

(Function): 一個(gè)可以解綁變化監(jiān)聽器的函數(shù)。

示例

function select(state) {
  return state.some.deep.property;
}

let currentValue;
function handleChange() {
  let previousValue = currentValue;
  currentValue = select(store.getState());

  if (previousValue !== currentValue) {
    console.log('Some deep nested property changed from', previousValue, 'to', currentValue);
  }
}

let unsubscribe = store.subscribe(handleChange);
handleChange();

replaceReducer(nextReducer)

替換 store 當(dāng)前用來計(jì)算 state 的 reducer。

這是一個(gè)高級(jí) API。只有在你需要實(shí)現(xiàn)代碼分隔，而且需要立即加載一些 reducer 的時(shí)候才可能會(huì)用到它。在實(shí)現(xiàn) Redux 熱加載機(jī)制的時(shí)候也可能會(huì)用到。

參數(shù)

1. reducer (Function) store 會(huì)使用的下一個(gè) reducer。