React Hooks 開發實戰

鬼哥 著

  • 出版商: 機械工業
  • 出版日期: 2023-01-01
  • 售價: $534
  • 貴賓價: 9.5$507
  • 語言: 簡體中文
  • 頁數: 259
  • 裝訂: 平裝
  • ISBN: 711171833X
  • ISBN-13: 9787111718338
  • 相關分類: React
  • 立即出貨

買這商品的人也買了...

商品描述

這是一本完全從企業實踐角度出發,為初學者和進階者撰寫的React Hooks開髮指導手冊。
來自多家大廠的業界專家給予高度評價,他們均認為這本書是入門並精通React Hooks的好書。
本書結合一線項目代碼對React Hooks核心API及相關技術點進行了深入解讀,
並配有大量圖例,讓讀者的學習過程更輕鬆,更有趣。
為了幫助讀者解決實際落地問題,
書中不僅通過真實案例盡量還原實際開發場景,還專門總結了實際開發過程中經常出現的典型問題。
為了幫助讀者把所學知識輕鬆運用到實際工作中,
本書還給出一個完整的企業級開發項目,從0到1完整展現項目開發過程。
本書共7章。
第1章對當前前端市場進行簡單分析,首先對React Hooks在當前前端市場中的定位及其與其他相關技術的異同進行深入解讀,
然後對React Hooks整個生命週期體系進行全面講解。
第2章重點介紹開發技術選型方法、基礎工具安裝方法及基礎項目搭建流程,幫助讀者從0到1搭建真實的開發環境。
第3章基於真實的場景案例,對React Hooks核心API進行詳細講解,並且對API使用優化進行了具體說明。
這是本書的重點,也是讀者真正把React Hooks用好的基礎。
第4章著重對React Redux在React Hooks中的使用以及相關注意事項進行詳細說明,
並重點介紹了企業開發過程中常用的配套插件,這是提升開發效率的基礎。
第5章重點介紹了實際React Hooks開發場景中經常遇到的典型問題及其解決方法和相關注意事項。
第6章基於作者的多年實踐經驗,分享了10個可以提升開發效率的企業級開發庫,
這裡不僅對各個庫的基本使用方法進行了介紹,還對其高級使用技巧、工作原理進行了分析。
第7章分享了一個真實電商訂單系統開發和上線的完整流程。
從項目創建,到eslintrc、Webpack等基礎工具的配置,
再到對常用業務組件的封裝(HTTP、菜單、權限、路由配置),本章都進行了詳細介紹。
此外,本章使用新的TypeScript語言進行示例說明與分析。

作者簡介

鬼哥(本名楊雲海)
畢業於桂林電子科技大學軟件工程專業。
現就職於某一線互聯網企業,任資深前端工程師。曾就職於美團、遊族網絡,任高級前端工程師。
深耕前端領域近10年,擁有豐富的企業級前端項目開發經驗。
在前端工程化、數據可視化方面擁有豐富的實戰經驗,
曾運用最新的數據可視化技術three.js完成某國家重點現代化項目。
精通Vue、React等前端主流技術,尤其是在React技術方面,
擁有多個千萬級用戶產品開發經驗。
熱愛分享和總結,積極參與了多個開源平台和技術社區,現為CSDN博客專家、掘金優秀創作者、GitHub倉庫作者(有上百顆星)。

目錄大綱

第1章初識React Hooks1
1.1 React Hooks概述1
1.1.1 React Hooks的優點1
1.1.2 React Hooks的缺點7
1.1.3 使用React Hooks時的注意事項10
1.2 React Hooks生命週期11
1.2.1 理解React Hooks生命週期12
1.2.2 函數式渲染與生命週期的關係12
1.2.3 函數式渲染的特點15
第2章基礎環境搭建16
2.1 基礎工具安裝16
2.2 創建基礎項目17
2.3 基礎項目目錄優化18
2.4 初始化項目配置21
第3章核心API原理解讀與實踐25
3.1 useState 25
3.1.1 上手使用useState 25
3.1.2 淺談useState異步27
3.1.3 使用useState時的注意事項29
3.1.4 useState原理解讀34
3.2 useRef37
3.2.1 上手使用useRef38
3.2.2 使用useRef時的注意事項40
3.3 forwardRef45
3.3.1 上手使用forwardRef45
3.3.2 使用forwardRef時的注意事項47
3.4 useImperativeHandle 50
3.4.1 上手使用useImperativeHandle50
3.4.2 使用useImperativeHandle時的注意事項53
3.4.3 useImperativeHandle原理解讀54
3.5 useEffect55
3.5.1 上手使用useEffect55
3.5.2 使用useEffect時的注意事項61
3.5.3 useEffect原理解讀69
3.6 useLayoutEffect70
3.6.1 上手使用useLayoutEffect70
3.6.2 useEffect與useLayoutEffect的區別72
3.7 useReducer74
3.7.1 上手使用useReducer74
3.7.2 useState與useReducer的實例對比77
3.7.3 使用useReducer時的注意事項88
3.8 useMemo88
3.8.1 上手使用React.memo88
3.8.2 上手使用useMemo 94
3.8.3 React.memo與useMemo的最佳使用場景102
3.9 useCallback102
3.9.1 上手使用useCallback102
3.9.2 使用useCallback時的注意事項109
3.10 useContext110
3.11 自定義Hooks115
3.11.1 上手自定義Hooks 115
3.11.2 編寫自定義Hooks的注意事項118
第4章React Redux原理解讀與實踐123
4.1 Redux123
4.2 Provider128
4.2.1 上手使用Provider128
4.2.2 Provider原理解讀130
4.3 useSelector131
4.3.1 上手使用useSelector131
4.3.2 useSelector原理解讀134
4.4 useDispatch135
4.4.1 上手使用useDispatch135
4.4.2 useDispatch原理解讀140
4.5 useStore140
4.5.1 上手使用useStore141
4.5.2 useStore原理解讀144
4.6 useReduxContext144
4.6.1 上手使用useReduxContext144
4.6.2 useReduxContext原理解讀147
4.7 中間件redux-logger148
4.8 中間件redux-persist150
第5章React Hooks常見問題解析154
5.1 如何正確實現組件復用154
5.1.1 合理使用有狀態組件和無狀態組件154
5.1.2 使用上下文管控依賴項155
5.1.3 狀態的可組合性156
5.1.4 分層復用158
5.2 如何在組件加載時正確發起異步任務159
5.3 需要注意哪些React Hooks錯誤寫法163
5.4 如何進行React Hooks場景下的優化169
5.4.1 函數定義位置優化169
5.4.2 組件更新優化170
5.4.3 針對高頻操作做防抖優化174
5.4.4 提高代碼可讀性和性能177
第6章常見的企業級Hooks解讀183
6.1 constate183
6.2 react-hook-form186
6.3 use-debounce189
6.4 useLocalStorage191
6.5 react-useportal193
6.6 useHover196
6.7 React router hooks196
6.8 use-http201
6.9 React Use204
6.10 ahooks208
第7章企業級React Hooks項目架構與實戰209
7.1 創建項目209
7.2 eslintrc配置212
7.3 Webpack配置214
7.4 全局Less和Ant懶加載配置216
7.5 環境變量配置219
7.6 技術與需求220
7.7 路由配置221
7.8 HTTP封裝223
7.9 登錄頁面開發229
7.10 Mock.js配置236
7.11 權限封裝240
7.12 左側菜單封裝243
7.13 Breadcrumb封裝246
7.14 異步Modal封裝249
7.15 實現SVG Icon253
.......