鐵人檔案
在這次的鐵人賽中，我會以單元式的方式介紹 React.js 的各種 Hooks、Context、React router、Redux & Redux toolkit、React 動畫、React 效能優化及其他瑣碎 React 特性功能等...
希望能透過一系列 React 相關的主題幫助自己和讀者更加認識 React.js。
鐵人賽大綱 在這次鐵人賽的挑戰中，主要的目標是希望自己和讀者們可以更加認識 React.js 或者是複習一下以前學過的知識，所以安排了幾個單元來進行介紹，預期介...
今天我們來認識一個相當常使用的 hook: useState。 語法 const [currentValue, setCurrentValue] = useSt...
今天要介紹的是常用的 hook，useEffect。 功用 React 元件本身是純函式，但還是有要處理到 side effect 的時候，而若要處理各種針對渲...
今天要介紹的是可以用來操作 DOM 元素的 useRef 及和它有關的 hook useImperativeHandle。 功用和特性 ref 是一個包含 cu...
讓開發者可以更容易的從母元件傳遞 state 到深層的子元件，並讓多個用到的 state 資料的元件可以隨著資料變動而更新。 語法 const value =...
這個 hook 可以讓我們用類似 redux 用 reducer、action、dispatch 操作 state。 useReducer 適合較複雜的 sta...
今天介紹的是避免重新渲染的 HOC(Higher Order Component) React.memo，透過它可以對元件重新渲染的時機做出控制。 React....
今天介紹的是 useMemo hook，透過它可以記憶一個值。 useMemo 真的是效能優化的利器?倒也不一定，看你怎麼使用它，過度使用反而只是拖垮效能罷了...
今天介紹的是 useCallback hook，透過它可以對一個函式重新執行的時機做出控制。 useCallback 真的是效能優化的利器?倒也不一定，看你怎...
經過前面幾天的介紹，我們認識了許多常使用的 hooks，不過除了那些 hooks 之外，我們也可以將一些常用的共同程式邏輯抽取出來寫一個函式，這就是 Custo...
