🔷
React useEffect Cleanup
useEffect에서 클린업 함수 사용하기
DevNest
TypeScript
ReactHooksuseEffectCleanup
typescriptReact useEffect Cleanup
1import { useEffect, useState } from 'react';2 3function Timer() {4 const [seconds, setSeconds] = useState(0);5 6 useEffect(() => {7 const interval = setInterval(() => {8 setSeconds(s => s + 1);9 }, 1000);10 11 // 클린업 함수: 컴포넌트 언마운트 시 실행12 return () => {13 clearInterval(interval);14 };15 }, []); // 빈 배열: 마운트 시 1회만 실행16 17 return <div>Seconds: {seconds}</div>;18}