[筆記] React Hooks 起來 – Ch6 – 建立自己的 Hook

Posted onAuthorANDY LIEN

章節連結

因為實務上的需要來熟悉 React，就趁機筆記一下從 Vue 3 轉 React Hooks 的一些細節差異。這邊筆記下如何建立自己的 Hook。

[筆記] React Hooks 起來 – Ch7 – 切換畫面元件

內容

1. customHook 有自己的 state 和生命週期
2. 在你開發函式時，會往往遇上重複性的邏輯，這是就可以抽出成一個共用函式。不過在 React 中，其內會使用到 use 開頭的內建函式
3. 自行開發的 Hook，一定要用 use 的名稱為開頭，也僅能在 Functional Component 中使用
4. 自行開發的 Hook，若你回傳的值是用 array 的型式，需自行指定型別。因為 TS 自行推斷的值會有機會出現錯誤

程式碼

https://github.com/andy922200/learn-react-from-hook/commit/c3a9e634a1ccea25299b372eec780452499428f3

系列文章

  • [筆記] React Hooks 起來 – Ch7 – 切換畫面元件
  • [筆記] React Hooks 起來 – Ch6 – useMemo 的使用
  • [筆記] React Hooks 起來 – Ch5 – useState 和 useEffect
  • [筆記] React Hooks 起來 – Ch5 – useCallback 和 TypeScript 注意事項
  • [筆記] React Hooks 起來 – Ch4 – 實作深色主題
  • [筆記] React Hooks 起來 – Ch4 – 增加狀態管理
  • [筆記] React Hooks 起來 – Ch4 – 前導
  • [筆記] React Hooks 起來 – Ch4 – SVG
  • [筆記] React Hooks 起來 – Ch3
  • [筆記] React Hooks 起來 – Ch1 ~ Ch2

    • 按讚加入粉絲團

    延伸閱讀