示例 · Redux 官方文檔中文翻譯

# 示例 Redux [源碼](https://github.com/gaearon/redux/tree/master/examples) 中同時包含一些示例。 > ##### 復制代碼時注意 > 如果你把 Redux 示例代碼復制到其它目錄，可以刪除位于 `webpack.config.js` 文件尾部 “You can safely delete these lines in your project.” 注釋后的代碼。 ### Counter 計數器示例運行 [Counter](https://github.com/gaearon/redux/tree/master/examples/counter) 示例： ~~~ git clone https://github.com/rackt/redux.git cd redux/examples/counter npm install npm start open http://localhost:3000/ ~~~ 這個示例包含： - 基本的 Redux 應用開發流程； - 測試代碼。 ### TodoMVC 示例運行 [TodoMVC](https://github.com/gaearon/redux/tree/master/examples/todomvc) 示例： ~~~ git clone https://github.com/rackt/redux.git cd redux/examples/todomvc npm install npm start open http://localhost:3000/ ~~~ 這個示例包含： - Redux 中使用兩個 reducer 的方法； - 嵌套數據更新； - 測試代碼。 ### Todos with Undo 示例運行 [todos-with-undo](https://github.com/rackt/redux/tree/master/examples/todos-with-undo) 示例: ~~~ git clone https://github.com/rackt/redux.git cd redux/examples/todos-with-undo npm install npm start open http://localhost:3000/ ~~~ 這個示例包含: - Redux 中使用兩個 reducer 的方法； - 使用 [redux-undo](https://github.com/omnidan/redux-undo) 在 Redux 中實現撤銷/重做功能。 ### 異步運行 [Async](https://github.com/gaearon/redux/tree/master/examples/async) 示例： ~~~ git clone https://github.com/rackt/redux.git cd redux/examples/async npm install npm start open http://localhost:3000/ ~~~ 這個示例包含： - 使用 [redux-thunk](https://github.com/gaearon/redux-thunk) 處理簡單的異步開發流程； - 緩存服務器響應數據，并在獲取數據過程中顯示加載進度條； - 緩存數據過期方法。 ### Universal 示例運行 [Universal](https://github.com/rackt/redux/tree/master/examples/universal) 示例: ~~~ git clone https://github.com/rackt/redux.git cd redux/examples/universal npm install npm start open http://localhost:3000/ ~~~ 這個示例包含： - 使用 Redux 和 React 的 [Universal rendering](#) 庫； - 經由異步得到輸入的內容，從而提前獲取 state ； - 從服務器端向客戶端傳遞 state 。 ### Real World 示例運行 [Real World](https://github.com/gaearon/redux/tree/master/examples/real-world) 示例： ~~~ git clone https://github.com/rackt/redux.git cd redux/examples/real-world npm install npm start open http://localhost:3000/ ~~~ 這個示例包含： - 實際應用中的 Redux 的異步處理； - 使用 [normalized](https://github.com/gaearon/normalizr) 結果集來保存并緩存數據； - 用于 API 請求的自定義 middleware ； - 緩存服務器響應數據，并在獲取數據過程中顯示加載進度條； - 分頁器； - 路由。 ### 更多參考 [Awesome Redux](https://github.com/xgrommx/awesome-redux) 獲取更多示例。