createStore(reducer, [initialState])
創(chuàng)建一個(gè) Redux store 來(lái)以存放應(yīng)用中所有的 state。應(yīng)用中應(yīng)有且僅有一個(gè) store。
reducer
(Function): 接收兩個(gè)參數(shù),分別是當(dāng)前的 state 樹(shù)和要處理的 action,返回新的 state 樹(shù)。
[initialState
] (any): 初始時(shí)的 state。在同構(gòu)應(yīng)用中,你可以決定是否把服務(wù)端傳來(lái)的 state 水合(hydrate)后傳給它,或者從之前保存的用戶會(huì)話中恢復(fù)一個(gè)傳給它。如果你使用 combineReducers
創(chuàng)建 reducer
,它必須是一個(gè)普通對(duì)象,與傳入的 keys 保持同樣的結(jié)構(gòu)。否則,你可以自由傳入任何 reducer
可理解的內(nèi)容。[TODO: Optimize]
(Store
): 保存了應(yīng)用所有 state 的對(duì)象。改變 state 的惟一方法是 dispatch action。你也可以 subscribe 監(jiān)聽(tīng) state 的變化,然后更新 UI。
import { createStore } from 'redux';
function todos(state = [], action) {
switch (action.type) {
case 'ADD_TODO':
return state.concat([action.text]);
default:
return state;
}
}
let store = createStore(todos, ['Use Redux']);
store.dispatch({
type: 'ADD_TODO',
text: 'Read the docs'
});
console.log(store.getState());
// ['Use Redux', 'Read the docs']
應(yīng)用中不要?jiǎng)?chuàng)建多個(gè) store!相反,使用 combineReducers
來(lái)把多個(gè) reducer 創(chuàng)建成一個(gè)根 reducer。
你可以決定 state 的格式。你可以使用普通對(duì)象或者 Immutable 這類的實(shí)現(xiàn)。如果你不知道如何做,剛開(kāi)始可以使用普通對(duì)象。
如果 state 是普通對(duì)象,永遠(yuǎn)不要修改它!比如,reducer 里不要使用 Object.assign(state, newData)
,應(yīng)該使用 Object.assign({}, state, newData)
。這樣才不會(huì)覆蓋舊的 state
。也可以使用 Babel 階段 1 中的 ES7 對(duì)象的 spread 操作 特性中的 return { ...state, ...newData }
。
對(duì)于服務(wù)端運(yùn)行的同構(gòu)應(yīng)用,為每一個(gè)請(qǐng)求創(chuàng)建一個(gè) store 實(shí)例,以此讓 store 相隔離。dispatch 一系列請(qǐng)求數(shù)據(jù)的 action 到 store 實(shí)例上,等待請(qǐng)求完成后再在服務(wù)端渲染應(yīng)用。
當(dāng) store 創(chuàng)建后,Redux 會(huì) dispatch 一個(gè) action 到 reducer 上,來(lái)用初始的 state 來(lái)填充 store。你不需要處理這個(gè) action。但要記住,如果第一個(gè)參數(shù)也就是傳入的 state 如果是 undefined
的話,reducer 應(yīng)該返回初始的 state 值。
更多建議: