系列文章
React—jsx基本介紹、snippet、各種css style解決方案
本篇文章將會正式介紹react 基本jsx 首先我可以看到一個簡單的jsx如下 import React from 'react' const App = ()...
function component的各種點記法(dot notation)，JSX的使用技巧
本日探討各種jsx的渲染，包含各種dot notaion方式、使用方括號變數動態使用component、條件渲染和使用jsx的使用技巧。 點記法render 官...
從jQuery到VirtualDOM來淺談什麼是state—useState完整範例與介紹
本篇文章將會涵蓋以下重點 資料變動但是畫面卻沒變？ state設計原因 使用useState Hook setState的誤區 state初始值—使用lazy...
siedEffect是什麼？—useEffect的4種情形、2個clearup範例、常見用途與注意事項
本文將包含sideEffect可帶參數的情形 只執行第一次 畫面任何更動都執行 依賴某個state 元件銷毀前-clearup 另外也包含範例與說明如下...
React管理virtualDOM，為什麼還需要useRef?
本文將提及以下內容 做到什麼事情? 解決什麼問題? useRef代入參數 在jsx的屬性當中加入ref focus效果範例 ref無法藉由react管理 簡述...
從useRef理解forwardRef再解說useImperativeHandle—目的與用法
本文章將包含以下內容 為什麼需要forwardRef 回顧useRef 直接將ref加在component上 forwardRef說明 forwardRef...
解決propDrilling問題—簡化consumer的useContext
本文章將提及以下內容 props傳遞的遇到什麼問題—propDrilling 使用context解決propDrilling Setp1 創建context...
為什麼useReducer，reducer詞彙解釋—用流程圖解釋useReducer
本文章內容涵蓋以下 為什麼你需要useReducer 關於reducer詞彙 useReducer流程圖 useReducer使用方式 為什麼需要useRe...
從實作To Do List理解Listing State Up(附圖)(上)
本文將以實作To Do List理解Listing State Up包含以下部分 component拆分—圖解 lifting-state說明 重要概念 具體...
從實作To Do List理解useContext搭配useReducer運作模型—(附圖)(中)
本文將以實作To Do List理解Listing State Up包含以下部分 useContext運作模型—圖解 useReducer運作模型—圖解 資料...