React - useRef

useRef

→ 새로운 Reference 객체를 생성하는 기능

const refObject= useRef();

useRef vs useState

항목	useRef	useState
✅ 주요 용도	DOM 접근, 리렌더링 없는 상태 보관	상태 저장 및 UI 리렌더링 트리거
🔄 값 변경 시 리렌더링	❌ 리렌더링 발생하지 않음	✅ 값 변경 시 컴포넌트 리렌더링
🧠 저장되는 값	.current 프로퍼티 내부에 저장	내부적으로 저장, 렌더링 간 값을 유지함
⏱ 초기화 타이밍	컴포넌트 마운트 시 한 번	마찬가지로 첫 렌더링 시 한 번
💥 비동기 동작 영향	영향 없음 (값 즉시 반영 가능)	렌더링에 따라 비동기 업데이트 가능성 있음
📦 예시 코드	const ref = useRef(null)	const [count, setCount] = useState(0)
🧩 주로 사용하는 상황	- DOM 접근- 이전 값 기억- 타이머 등	- UI 상태 관리- 입력 값- toggle 등