tags: ItIron2023 react 前言 我們昨天做了一個基本的井字遊戲,基本上除了css的部分有些困難之外,基本的邏輯實踐其實相當的單純,今天我們反...
心得分享 很高興第二次參加 iThome 鐵人賽也能順利完賽,有了第一次參加的經驗後,對於整體的文章規劃也更加明確,不僅如此,參加 IThome 鐵人賽讓我感...
tags: ItIron2023 react 前言 我們昨天處理了一個實務上常見的面試問題,要你根據某份提供的api文件以及一些指示完成題目的要求,今天我們再來...
什麼是 Redex? Redux 是一個用於狀態管理的第三方 Library,它在概念上類似於使用 Context API + useReducer,因此,如...
tags: ItIron2023 react 前言 昨天我們完成了add emoji onclick的問題,額外用了幾個state以及timer去達到題目的要求...
useMemo 和 useCallback 要解決什麼? 在昨天的文章裡,我們最後有遇到一個問題,當我們傳入的 props 是一個物件時,元件在重新渲染的時候...
tags: ItIron2023 react 前言 我們昨天做了一個還算有趣的問題,利用state控制整個emoji陣列並決定每個組件要在螢幕的哪處渲染,今天我...
什麼是 memo? memo 函式用於建立一個在其父層重新渲染時不會重新渲染的元件,只要該元件在渲染之間 props 保持不變,但是當元件本身的狀態或是訂閱的...
為什麼需要 Context API? 讓我們看一個例子,DComponent 跟 FComponent 需要最頂層 AComponent 的狀態 name,此...
tags: ItIron2023 react 前言 我們昨天看了一個很水的custom hook題目,希望透過那個水到爆炸的題目你有了解到可以利用custom...
在 React 中,Router params 的應用對於在不同頁面之間傳遞資料至關重要。今天將介紹如何在 React Router 中使用動態路由,包括建立...
tags: ItIron2023 react 前言 昨天我們看了一個基本的Tab component題目,在那個常見的UI組件上做了一點小小的測試,相信對你們來...
為什麼需要嵌套路由? 在開發中,應用程式常常需要更加複雜的路由結構,例如 /user/profile 和 /user/settings,為了實現這種層次化路由...
tags: ItIron2023 react 前言 我們昨天做了一個簡單的todo list,透過那個題目可以檢驗你對於state & props的掌握...
為什麼不使用 <a> 標籤進行路由導航? 在 React 中,不建議直接使用一般的 <a> 標籤進行導航,原因如下: 重新加載整個頁...
tags: ItIron2023 react 前言 昨天我們用了一個簡單的問題來測驗你對於react render邏輯的了解程度,相信透過昨天的經驗你應該對於u...
什麼是 React Router? React Router 是 React 生態系中一個重要的 Library,主要處理 React 應用程式中的路由。開發...
什麼是 useReducer? useReducer 是 React 提供的 Hooks 之一,用於管理狀態和處理與狀態相關的操作。 它與 useState...
tags: ItIron2023 react 前言 我們昨天看了一個有趣的useState問題,了解到initialValue的一些限制,今天我們會再看一個與s...
在 React 16.8 版本以前,開發者使用不同的方法來撰寫 React 元件,這種方法涉及使用 class 和生命週期方法。 儘管如今開發者更傾向於使用函...
tags: ItIron2023 react 前言 我們昨天看了一個少見的useLayoutEffect的實用例子,很多工具只要正確使用就能發光發熱,但前提是你...
什麼是 useRef? useRef 是 React 提供的內建 Hooks 之一,它用於創建一個稱為 ref 的物件,這個 ref 可以用來儲存和訪問在多次...
tags: ItIron2023 react 前言 昨天我們看了一個誤用useEffect的例子,了解到其實有些東西你不需要靠useEffect也能達成,今天我...
什麼是Custom Hooks? Custom Hooks 的核心概念是可重用性,在 React 中,我們可以將可重用的邏輯封裝成 Custom Hooks,...
tags: ItIron2023 react 前言 我們昨天再次看了一個React.memo的錯誤使用例子,你也了解到該如何正確地使用useCallback,我...
我們已經介紹了一些 React Hooks(像是 useState 和 useEffect),在今天的文章中,我們將探討 React Hooks 的工作原理以...
tags: ItIron2023 react 前言 真是沒完沒了是吧!昨天我們繼續看了一個不必要重複渲染的例子,了解到為什麼切context需要謹慎並再次的請出...
什麼是 Cleanup Function? 在 React 中,useEffect 允許我們執行副作用操作,同時還提供了一種清理這些副作用的機制。 Clea...
tags: ItIron2023 react 前言 我們前兩天將重點放在React.memo使用上的一些情境與錯誤,接著我們將繼續探討其他造成不必要重複渲染的情...
為什麼需要 useEffect? 以下是一個範例,我們一開始透過 fetch 方法從遠端 API 取得資料,並將取的回來的資料 data.Search 透過...