iT邦幫忙

鐵人檔案

2024 iThome 鐵人賽
回列表
Modern Web

現在就學React.js 系列

原先主力是寫Vue.js,總是寫Vue也會好奇旁邊的發展,後來有機會到用React的公司工作,就想這趁段時間記錄自己的所學,也同時強化自己的學習,也保持分享的心態進行,與大家交流。

鐵人鍊成 | 共 31 篇文章 | 1 人訂閱 訂閱系列文 RSS系列文
DAY 21

告別不必要的渲染:理解 React useRef -Day21

在 React 中,我們經常使用 useState 來管理組件的狀態,並讓組件隨著狀態的變化重新渲染。不過在某些情況,不希望狀態變更時觸發重新渲染,這時就可以使...

2024-10-05 ‧ 由 鯨魚 分享
DAY 22

useContext 輕鬆共享資料之props drilling的解方 - Day22

隨著專案的成長,需要將父組件的資料傳遞給深層的子組件。這樣的資料傳遞過程會逐漸變得複雜且繁瑣。React 提供的 useContext Hook 能夠有效解決這...

2024-10-06 ‧ 由 鯨魚 分享
DAY 23

用useMemo優化效能 - Day23

useMemo 是 React 中用來記憶化計算結果的一個 Hook。能夠在每次重新渲染的時候緩存計算的結果,只有當某些依賴項發生變化時才會重新計算,這在處理昂...

2024-10-07 ‧ 由 鯨魚 分享
DAY 24

提升組件的效能-memo - Day24

在 React 中父組件重新渲染時,所有子組件也會重新渲染,即便這些子組件的 props 沒有發生變化。使用 memo 可以避免不必要的渲染,從而提升應用效能。...

2024-10-08 ‧ 由 鯨魚 分享
DAY 25

useCallback的使用時機 - Day25

在 React 中,當父組件重新渲染時,內部的變數和函式也會被重新創建,這可能導致子組件不必要的重新渲染,進而影響效能。為了避免這種情況,我們可以使用 memo...

2024-10-09 ‧ 由 鯨魚 分享
DAY 26

打造自己的 Hook:Custom Hook Day26

在 React 開發中,有時一些邏輯和功能會常常重複出現,若開發時沒有將程式碼做共用的話,就會到處都寫差不多像的內容,之後要做更改的話,就要同步作調整。這樣的寫...

2024-10-10 ‧ 由 鯨魚 分享
DAY 27

React useReducer 進階狀態管理 -Day27

useReducer 是 React 提供的 Hook,用於處理更複雜的狀態管理。與 useState 相比,它引入了 reducer 函數來決定狀態更新的方式...

2024-10-11 ‧ 由 鯨魚 分享
DAY 28

React Redux 進階狀態管理工具 - Day28

Redux 是一個 JavaScript 狀態管理工具,經常與 React 搭配使用,來管理複雜的應用程式狀態。Redux 基於 Flux 架構並進行改良,透過...

2024-10-12 ‧ 由 鯨魚 分享
DAY 29

React Redux 實作- Day 29

昨日說明了Redux的介紹,今天就要再來準備實作的操作,這次實作也是要把 Day18 的TodoList小作品做個重構,讓原先用 useState 改用成 R...

2024-10-13 ‧ 由 鯨魚 分享
DAY 30

React Redux Toolkit Day30

Redux 是一個狀態管理庫,主要用來管理應用中的全局狀態,特別是當應用變得複雜時。Redux Toolkit(RTK)是官方推薦的開發 Redux 應用的工具...

2024-10-14 ‧ 由 鯨魚 分享