ref에 또다른 사용법 컴포넌트별로 참조하기

useRef()훅은 포인터와 비슷한 느낌으로사용할수있습니다

useRef()훅은 DOM객체들을 참조할수도있지만

참조를 어떤 종류의 값이든 제어하기위해 사용할수도 있습니다.

const timer =useRef()

timer 상수가 위의 참조를 보관하는것입니다.

여러개의 컴포넌트에서 timer를 변수로 만들거나 상태값으로 관리하게되면 여러개의 컴포넌트가 시작될때마다 함수가 재실행되어

timer변수의 포인터가 바뀝니다

하지만 useRef()를 이용하여 해당 컴포넌트의 참조를 만들어 각각의 컴포넌트가 따로 작동할수있게 만들수 있습니다

timer.current = setTimeout(()=>{
	alert("함수작동")
} , 1000)

setTimeout() 내장함수를 이용하여 1초후 알림창이 작동하는 코드입니다

참조를이용하면 해당 컴포넌트에서 1초후 작동할수있게 만들수 있습니다.

useRef()로 참조를이용하게되면 모든 컴포넌트 인스턴스들은 자기들만의 timer참조를 갖을것입니다.