Redux API之creatStore

createStore(reducer, [initialState])

建立一個 Redux store 來以存放應用中全部的 state。
應用中應有且僅有一個 store。

參數

1. reducer (Function): 接收兩個參數，分別是當前的 state 樹和要處理的 action，返回新的 state 樹。

2. [initialState] (any): 初始時的 state。 在同構應用中，你能夠決定是否把服務端傳來的 state 水合（hydrate）後傳給它，或者從以前保存的用戶會話中恢復一個傳給它。若是你使用 combineReducers建立 reducer，它必須是一個普通對象，與傳入的 keys 保持一樣的結構。不然，你能夠自由傳入任何reducer 可理解的內容。

返回值

(Store): 保存了應用全部 state 的對象。改變 state 的唯一方法是 dispatch action。你也能夠 subscribe 監聽 state 的變化，而後更新 UI。

 1 import { createStore } from 'redux'
 2 
 3 function todos(state = [], action) {
 4   switch (action.type) {
 5     case 'ADD_TODO':
 6       return state.concat([ action.text ])
 7     default:
 8       return state
 9   }
10 }
11 
12 let store = createStore(todos, [ 'Use Redux' ])
13 
14 store.dispatch({
15   type: 'ADD_TODO',
16   text: 'Read the docs'
17 })
18 
19 console.log(store.getState())
20 // [ 'Use Redux', 'Read the docs' ]

View Code

小貼士

• 應用中不要建立多個 store！相反，使用 combineReducers 來把多個 reducer 建立成一個根 reducer。

• 你能夠決定 state 的格式。你能夠使用普通對象或者 Immutable 這類的實現。若是你不知道如何作，剛開始能夠使用普通對象。

• 若是 state 是普通對象，永遠不要修改它！好比，reducer 裏不要使用 Object.assign(state,newData)，應該使用 Object.assign({}, state, newData)。這樣纔不會覆蓋舊的 state。也能夠使用Babel 階段 1 中的 ES7 對象的 spread 操做 特性中的 return { ...state, ...newData }。

• 對於服務端運行的同構應用，爲每個請求建立一個 store 實例，以此讓 store 相隔離。dispatch 一系列請求數據的 action 到 store 實例上，等待請求完成後再在服務端渲染應用。

• 當 store 建立後，Redux 會 dispatch 一個 action 到 reducer 上，來用初始的 state 來填充 store。你不須要處理這個 action。但要記住，若是第一個參數也就是傳入的 state 若是是 undefined 的話，reducer 應該返回初始的 state 值。