【りあクト!2】React Hooks

【りあクト!2】React Hooks

りあクト!2 React Hooksについて

useState

useStateはstateを更新するHooks API

const [count,setCount] = useState(0); const increment = () => setCount((c)=>c+1); const decrement = () => setCount((c)=>c-1);

Hooksの呼び出しはその関数コンポーネントの論理階層のトップレベルである必要があるので、条件文や繰り返し処理の中で呼び出すのは不可

const Count: FC<{ max: number }> = ({ max }) => { const [count, setCount] = useState(0); if(count => max){ // if文の中でuseState()は使わない! const [isExceeded, setIsExceeded] = useState(true); doSomething(...) } }

useEffect

useCallback

useRef

Custom Hook

useTimeout

const useTimeout = (callback, delay)=>{ }
前の記事
TypeScript+ESLintで引っ掛かった所
次の記事
JavaScriptで◯×ゲーム(三目並べ)を作る