此次的內容主要會圍繞在我在前端開發所使用的相關技術,從建構工具到React.js等相關的技術分享。希望能藉由此次機會將自己會的技術與不熟悉的技術跟大家交流討論。
component的狀態保存 我們在先前的第一個範例,有看到使用react提供的hook-useState,來當作狀態的管理。 import { useStat...
渲染細節流程 前幾篇我們有提到useState的setter function會觸發重新渲染這個機制,這篇我們會更詳細說明渲染的細節。 首先們先回顧一下整個更新...
前一篇有提到渲染,這篇會介紹渲染與畫面更新的知識 什麼是渲染(render)? 在知道畫面怎麼更新前,先來說明一下什麼是渲染,我們看到渲染很直覺會想到瀏覽器的渲...
React使用了virtual DOM來取代直接操作DOM,這篇會簡單介紹React的virtual DOM的機制。 DOM是什麼? Document Obje...
很多語言或是套件都會有生命週期的概念,就像是之前介紹的git hook一樣,React當然也不例外,供我們在特定階段能做一些操作。 先看常見的生命週期(如下圖)...
今天要介紹React的另一個Hook-useReducer,useReducer和useState一樣都是用於狀態管理的Hook,在同個專案或是componen...
在React如果要在組件之間傳遞資料可以使用props,用起來就像是呼叫帶入參數的函式。 function Content({text}) { // 使用解構將...
redux的核心概念其實和useReducer加上useContext組合技的概念很類似,都會有一個全域的單一狀態,要改變狀態就只能使用dispatch送出一個...
今天這篇文章要來介紹另外兩個hooks,useCallback和useMemo兩個都是用來效能優化的hooks,用法相當類似,都是藉由快取來達到優化的效果。 u...
今天要來介紹的是useRef這個hook,在使用的時候可能常常會和useState搞混,但是事實上它們的使用情境是很大的不同的,接下來來一一介紹useRef的特...