React Hooks實戰/Web開發與設計

作者：(英)約翰·拉森|責編:王軍|譯者:周軼//張兆陽//顏宇
出版社：清華大學
ISBN：9787302613572

出版日期：2022/08/01
裝幀：平裝
頁數：315

人民幣：RMB 98 元售價：元

內容大鋼

    使用React Hooks后，你很快就會發現，代碼變得更具有組織性且更易於維護。React Hooks是旨在為用戶提供跨組件的重用功能和共享功能的JavaScript函數。利用React Hooks，可以將組件分成多個函數、管理狀態和副作用，並且不必聲明類即可調用React內置的功能。而且，上述所有的操作都不涉及重新調整組件的層級。
    本書將指導你使用hook開發性能優秀、可復用度高的React組件。首先，你將學習如何使用hook創建組件代碼。接下來，你會親自實現一個資源預訂應用程序，這個示例演示了如何管理本地狀態、應用程序狀態以及類似請求數據之類的副作用。書中的代碼示例以及圖表可幫助你更加輕鬆地學習hook。
    主要內容：
    構建可調用React功能的函數組件；
    管理本地狀態、共享狀態以及應用程序狀態；
    學習內置hook、自定義hook以及第三方hook；
    利用React Query載入、更新和緩存數據；
    利用代碼分割和React Suspense請求數據並提升頁面體驗。

作者介紹

(英)約翰·拉森|責編:王軍|譯者:周軼//張兆陽//顏宇
約翰·拉森（John Larsen），從20世紀80年代開始從事編程工作，最開始是在Commodore VIC-20上編寫Basic，隨後又涉獵了Java、PHP、C#以及JavaScript等領域。他還編寫了同樣由曼寧出版社出版的Get Programming with JavaScript一書。他在英國當了25年的數學老師，為高中生講授電腦知識，併為學校開發與教學類、學習類以及溝通有關的Web程序。

第Ⅰ部分  React Hooks介紹及應用
  第1章  逐漸演進的React
    1.1  什麼是React
      1.1.1  用組件構建UI
      1.1.2  同步狀態和UI
      1.1.3  理解組件的類型
    1.2  React中的新增功能
    1.3  可以為函數式組件添加狀態的React Hooks
      1.3.1  有狀態的函數式組件：更少的代碼，更好的組織結構
      1.3.2  自定義hook：更易於代碼復用
      1.3.3  第三方的hook提供了完備的、經過良好測試的功能
    1.4  通過Concurrent模式和Suspense獲得更好的UX
      1.4.1  Concurrent模式
      1.4.2  Suspense
    1.5  全新的React發布渠道
    1.6  本書讀者對象
    1.7  開始吧
    1.8  本章小結
  第2章  使用useState hook管理組件的狀態
    2.1  搭建預訂管理應用程序
      2.1.1  通過create-react-app生成應用程序的框架
      2.1.2  編輯四個關鍵文件
      2.1.3  為應用程序添加資料庫文件
      2.1.4  創建頁面組件和UserPicker.js文件
    2.2  通過useState存儲、使用和設置值
      2.2.1  給變數賦新值並不會更新UI
      2.2.2  調用useState返回一個值和一個updater函數
      2.2.3  調用updater函數替換之前的狀態值
      2.2.4  將函數傳遞給useState作為初始值
      2.2.5  設置新狀態時需要使用之前的狀態
    2.3  多次調用useState以處理多個狀態值
      2.3.1  使用下拉菜單設置狀態
      2.3.2  使用複選框設置狀態
    2.4  複習函數式組件概念
    2.5  本章小結
  第3章  使用useReducer hook管理組件的狀態
    3.1  在響應一個事件時更新多個狀態值
      3.1.1  不可預測的狀態變化會將用戶帶離焦點
      3.1.2  通過可預測的狀態變化讓用戶沉浸在電影中
    3.2  通過useReducer管理更複雜的狀態
      3.2.1  使用reducer及一個預定義的action集更新狀態
      3.2.2  為BookablesList組件構建reducer
      3.2.3  使用useReducer訪問組件狀態並分派action
    3.3  通過函數生成初始狀態
      3.3.1  引入WeekPicker組件
      3.3.2  創建用以處理日期和星期的工具函數
      3.3.3  構建幫助組件管理日期的reducer
      3.3.4  向useReducerhook傳遞初始化函數
      3.3.5  使用WeekPicker更新BookingsPage
    3.4  複習useReducer的相關概念

    3.5  本章小結
  第4章  處理副作用
    4.1  通過簡單示例探討useEffectAPI
      4.1.1  在每次渲染后運行副作用
      4.1.2  僅當組件被掛載時運行副作用
      4.1.3  通過返回一個函數清理副作用
      4.1.4  通過指定依賴項控制effect的運行時間
      4.1.5  總結調用useEffect hook的方式
      4.1.6  在瀏覽器重繪之前調用useLayoutEffect運行effect
    4.2  獲取數據
      4.2.1  新建一個db.json文件
      4.2.2  設置JSON伺服器
      4.2.3  通過useEffect hook獲取數據
      4.2.4  使用async和await
    4.3  獲取BookablesList組件的數據
      4.3.1  測試數據載入的過程
      4.3.2  更新reducer以管理載入中狀態和錯誤狀態
      4.3.3  創建一個用於載入數據的輔助函數
      4.3.4  載入可預訂對象
    4.4  本章小結
  第5章  使用useRef hook管理組件狀態
    5.1  更新狀態但不觸發重新渲染
      5.1.1  對比useState和useRef在更新狀態值時的區別
      5.1.2  調用useRef
    5.2  在ref中保存計時器ID
    5.3  保存DOM元素的引用
      5.3.1  在事件響應中將焦點設置到指定元素上
      5.3.2  利用ref控制文本框
    5.4  本章小結
  第6章  管理應用程序的狀態
    6.1  向子組件傳遞共享狀態
      6.1.1  通過設置子組件的prop傳遞父組件的狀態
      6.1.2  從父組件接收狀態作為prop
      6.1.3  從父組件接收updater函數作為prop
    6.2  拆分組件
      6.2.1  將組件視為大型應用程序的一部分
      6.2.2  在一個頁面上組織多個組件
      6.2.3  創建BookableDetails組件
    6.3  共享useReducer返回的狀態和dispatch函數
      6.3.1  在BookablesView組件中管理狀態
      6.3.2  從reducer中刪除一個action
      6.3.3  在BookablesList組件中接收狀態和dispatch函數
    6.4  共享useState返回的狀態和updater函數
      6.4.1  在BookablesView組件中管理選定的可預訂信息
      6.4.2  在BookablesList中接收可預訂信息和updater函數
    6.5  使用useCallback傳遞函數以避免重複定義
      6.5.1  使用prop傳入的函數作為依賴項
      6.5.2  使用useCallbackhook維護函數的標識
    6.6  本章小結
  第7章  使用useMemo管理性能

    7.1  廚子不喜歡製作一人份的小蛋糕
      7.1.1  使用高開銷演算法生成變位詞
      7.1.2  避免多餘的函數調用
    7.2  通過useMemo記憶化高開銷函數
    7.3  在Bookings頁面上組織組件
      7.3.1  使用useState管理選定的可預訂對象
      7.3.2  使用useReducer和useState管理選定的星期和預訂信息
    7.4  使用useMemo高效創建預訂信息網格組件
      7.4.1  生成時間段和日期的網格
      7.4.2  生成預訂信息的查詢對象
      7.4.3  提供數據載入函數getBookings
      7.4.4  創建BookingsGrid組件並調用useMemo
      7.4.5  在useEffect中獲取數據時處理多個響應競爭的情況
    7.5  本章小結
  第8章  使用ContextAPI管理狀態
    8.1  從上層的組件樹中獲取狀態
      8.1.1  當頁面首次載入時顯示一條行為召喚的消息
      8.1.2  當用戶選定預訂信息時顯示預訂信息詳情
      8.1.3  顯示一個用於編輯用戶預訂信息的按鈕問題
      8.1.4  顯示一個用於編輯用戶預訂信息的按鈕解決方案
    8.2  使用自定義的provider和多個context
      8.2.1  將對象用作contextprovider的值
      8.2.2  將狀態移到自定義provider中
      8.2.3  使用多個context
      8.2.4  為context指定一個默認值
    8.3  本章小結
  第9章  創建自定義hook
    9.1  將功能提取到自定義hook中
      9.1.1  重新組織通用功能
      9.1.2  在組件外部聲明自定義hook
      9.1.3  在自定義hook中調用自定義hook
    9.2  遵循hook的規則
      9.2.1  僅在組件的最頂層調用hook
      9.2.2  只從React函數式組件中調用hook
      9.2.3  使用ESLint插件檢查hook的規則
    9.3  更多關於自定義hook的示例
      9.3.1  使用useWindowSizehook獲取窗口尺寸
      9.3.2  使用useLocalStoragehook獲取/設置值
    9.4  使用自定義hook消費context值
    9.5  使用自定義hook封裝數據請求
      9.5.1  開發useFetchhook
      9.5.2  使用useFetchhook返回的data、status和error屬性
      9.5.3  創建專用的數據請求hook：useBookings
    9.6  本章小結
  第10章  使用第三方hook
    10.1  利用ReactRouter訪問URL中的狀態
      10.1.1  設置路由並開啟嵌套路由功能
      10.1.2  為Bookables頁面添加嵌套的路由
      10.1.3  利用useParamshook獲取URL參數
      10.1.4  使用useNavigatehook導航

    10.2  獲取和設置查詢字元串中的查詢參數
      10.2.1  從查詢字元串獲取查詢參數
      10.2.2  設置查詢字元串
    10.3  使用ReactQuery讓數據獲取過程更流暢
      10.3.1  ReactQuery簡介
      10.3.2  組件可訪問ReactQuery的client實例
      10.3.3  使用useQuery獲取數據
      10.3.4  訪問查詢緩存中的數據
      10.3.5  使用useMutation更新服務端狀態
    10.4  本章小結
第Ⅱ部分  揭秘React Concurrent特性
  第11章  利用Suspense進行代碼分割
    11.1  利用import函數動態導入代碼
      11.1.1  新建Web頁面並在單擊按鈕時載入JavaScript
      11.1.2  默認導出和命名導出
      11.1.3  使用靜態導入載入JavaScript
      11.1.4  調用import函數動態載入JavaScript
    11.2  利用lazy和Suspense動態導入組件
      11.2.1  利用lazy函數將組件包裝成懶載入組件
      11.2.2  利用Suspense組件聲明回退內容
      11.2.3  理解lazy和Suspense組件協同工作的方式
      11.2.4  根據路由進行代碼分割
    11.3  利用錯誤邊界捕獲異常
      11.3.1  在React文檔中查看錯誤邊界的示例
      11.3.2  開發一個自定義錯誤邊界
      11.3.3  從異常中恢復
    11.4  本章小結
  第12章  整合數據請求和Suspense
    12.1  使用Suspense請求數據
      12.1.1  封裝promise並上報其狀態
      12.1.2  利用promise狀態整合Suspense
      12.1.3  盡可能早地開始請求數據
      12.1.4  請求新的數據
      12.1.5  從異常中恢復
      12.1.6  閱讀React文檔
    12.2  整合ReactQuery、Suspense和錯誤邊界
    12.3  使用Suspense載入圖片
      12.3.1  使用ReactQuery和Suspense提供圖片載入回退UI
      12.3.2  利用ReactQuery提前請求圖片和數據
    12.4  本章小結
  第13章  實驗特性：useTransition、useDeferredValue和SuspenseList
    13.1  在不同狀態間更順滑地過渡
      13.1.1  利用useTransition避免狀態退化
      13.1.2  利用isPending為用戶提供反饋
      13.1.3  為通用組件添加過渡特性
      13.1.4  利用useDeferredValue保存舊值
    13.2  使用SuspenseList管理多個回退UI
      13.2.1  顯示多種來源的數據
      13.2.2  利用SuspenseList控制多個回退UI
    13.3  Concurrent模式及未來

    13.4  本章小結

同類熱銷排行榜

最近瀏覽的商品

React Hooks實戰/Web開發與設計