第1章 初入React世界1
1.1 React簡介1
1.1.1 專注視圖層1
1.1.2 Virtual DOM1
1.1.3 函數式編程2
1.2 JSX語法3
1.2.1 JSX的由來3
1.2.2 JSX基本語法7
1.3 React組件11
1.3.1 組件的演變11
1.3.2 React組件的構建18
1.4 React數據流21
1.4.1 state21
1.4.2 props23
1.5 React生命周期29
1.5.1 掛載或卸載過程29
1.5.2 數據更新過程30
1.5.3 整體流程33
1.6 React與DOM34
1.6.1 ReactDOM35
1.6.2 ReactDOM的不穩定方法36
1.6.3 refs38
1.6.4 React之外的DOM操作40
1.7 組件化實例：Tabs組件41
1.8 小結47
第2章 漫淡React48
2.1 事件系統48
2.1.1 合成事件的綁定方式48
2.1.2 合成事件的實現機制49
2.1.3 在React中使用原生事件51
2.1.4 合成事件與原生事件混用51
2.1.5 對比React合成事件與JavaScript原生事件54
2.2 表單55
2.2.1 應用表單組件55
2.2.2 受控組件60
2.2.3 非受控組件61
2.2.4 對比受控組件和非受控組件62
2.2.5 表單組件的幾個重要屬性63
2.3 樣式處理64
2.3.1 基本樣式設置64
2.3.2 CSS Modules66
2.4 組件間通信74
2.4.1 父組件向子組件通信74
2.4.2 子組件向父組件通信75
2.4.3 跨級組件通信77
2.4.4 沒有嵌套關系的組件通信79
2.5 組件間抽象81
2.5.1 mixin81
2.5.2 高階組件86
2.5.3 組合式組件開發實踐93
2.6 組件性能優化97
2.6.1 純函數97
2.6.2 PureRender100
2.6.3 Immutable103
2.6.4 key109
2.6.5 react—addons—perf110
2.7 動畫111
2.7.1 CSS動畫與JavaScript動畫111
2.7.2 玩轉ReactTransition113
2.7.3 緩動函數116
2.8 自動化測試121
2.8.1 Jest121
2.8.2 Enzyme124
2.8.3 自動化測試125
2.9 組件化實例：優化Tabs組件125
2.10 小結133
第3章 解讀React源碼134
3.1 初探React源碼134
3.2 Virtual DOM模型137
3.2.1 創建React元素138
3.2.2 初始化組件入口140
3.2.3 文本組件141
3.2.4 DOM標簽組件144
3.2.5 自定義組件150
3.3 生命周期的管理藝術151
3.3.1 初探React生命周期152
3.3.2 詳解React生命周期152
3.3.3 無狀態組件163
3.4 解密setState機制164
3.4.1 setState異步更新164
3.4.2 setState循環調用風險165
3.4.3 setState調用棧166
3.4.4 初識事務168
3.4.5 解密setState170
3.5 diff算法172
3.5.1 傳統diff算法172
3.5.2 詳解diff172
3.6 ReactPatch方法181
3.7 小結183
第4章 認識Flux架構模式184
4.1 React獨立架構184
4.2 MV*與Flux190
4.2.1 MVC／MVVM190
4.2.2 Flux的解決方案193
4.3 Flux基本概念194
4.4 Flux應用實例198
4.4.1 初始化目錄結構198
4.4.2 設計store198
4.4.3 設計actionCreator200
4.4.4 構建controller—view202
4.4.5 重構view203
4.4.6 添加單元測試205
4.5 解讀Flux206
4.5.1 Flux核心思想206
4.5.2 Flux的不足207
4.6 小結207
第5章 深入Redux應用架構208
5.1 Redux簡介208
5.1.1 Redux是什麼208
5.1.2 Redux三大原則209
5.1.3 Redux核心API210
5.1.4 與React綁定211
5.1.5 增強Flux的功能212
5.2 Reduxmiddleware212
5.2.1 middleware的由來212
5.2.2 理解middleware機制213
5.3 Redux異步流217
5.3.1 使用middleware簡化異步請求217
5.3.2 使用middleware處理復雜異步流221
5.4 Redux與路由224
5.4.1 React Router225
5.4.2 React Router Redux227
5.5 Redux與組件229
5.5.1 容器型組件229
5.5.2 展示型組件229
5.5.3 Redux中的組件230
5.6 Redux應用實例231
5.6.1 初始化Redux項目231
5.6.2 划分目錄結構232
5.6.3 設計路由234
5.6.4 讓應用跑起來235
5.6.5 優化構建腳本239
5.6.6 添加布局文件239
5.6.7 准備首頁的數據242
5.6.8 連接Redux245
5.6.9 引入Redux Devtools250
5.6.10 利用middleware實現Ajax請求發送251
5.6.11 請求本地的數據252
5.6.12 頁面之間的跳轉253
5.6.13 優化與改進256
5.6.14 添加單元測試257
5.7 小結258
第6章 Redux高階運用259
6.1 高階reducer259
6.1.1 reducer的復用259
6.1.2 reducer的增強261
6.2 Redux與表單262
6.2.1 使用redux—form—utils減少創建表單的冗余代碼263
6.2.2 使用redux—form完成表單的異步驗證265
6.2.3 使用高階reducer為現有模塊引入表單功能267
6.3 ReduxCRUD實戰268
6.3.1 准備工作268
6.3.2 使用Table組件完成「查」功能269
6.3.3 使用Modal組件完成「增」與「改」274
6.3.4 巧用Modal實現數據的刪除確認277
6.3.5 善用promise玩轉Redux異步事件流278
6.4 Redux性能優化279
6.4.1 Reselect280
6.4.2 Immutable Redux282
6.4.3 Reducer性能優化282
6.5 解讀Redux284
6.5.1 參數歸一化285
6.5.2 初始狀態及getState286
6.5.3 subscribe286
6.5.4 dispatch287
6.5.5 replaceReducer288
6.6 解讀react—redux288
6.6.1 Provider288
6.6.2 connect290
6.6.3 代碼熱替換293
6.7 小結294
第7章 React服務端渲染295
7.1 React與服務端模板295
7.1.1 什麼是服務端渲染295
7.1.2 react—view296
7.1.3 react—view源碼解讀296
7.2 React服務端渲染299
7.2.1 玩轉Node.js300
7.2.2 React—Router和Koa—Router統一303
7.2.3 同構數據處理的探討306
7.3 小結307
第8章 玩轉React可視化308
8.1 React結合Canvas和SVG308
8.1.1 Canvas與SVG308
8.1.2 在React中的Canvas310
8.1.3 React中的SVG311
8.2 React與可視化組件316
8.2.1 包裝已有的可視化庫316
8.2.2 使用D3繪制UI部分317
8.2.3 使用React繪制UI部分319
8.3 Recharts組件化的原理322
8.3.1 聲明式的標簽323
8.3.2 貼近原生的配置項325
8.3.3 接口式的API326
8.4 小結328
附錄A 開發環境329
附錄B 編碼規范345
附錄C Koamiddleware349
