[React] useRef()에 이전 값을 저장하는 방법

 

개인 공부 후 자료를 남겨놓기 위한 목적이므로,
생략되거나 오류가 있을 수 있음을 알립니다.
설명에 대한 지적은 언제나 환영입니다. :)

---

 

react를 사용하게 되면 input 태그의 기본 값을 설정 해놓을 일이 생기는 데, 이때 사용하는것이 useState와 useRef이다.

 

사용하고자 하는 목적에 따라 둘 중 하나를 선택하게 되는데, 이 중 useRef를 사용할 때, 기본 값을 설정하는 법에 대해 알아보자.

 

input의 기본값을 넣어줄 때는 보통 value를 사용하게 된다. 하지만 value를 사용하게 되면, 값을 변경하려고 해도 바뀌지 않기 때문에 이때는 defaultValue를 사용하면 된다.

 

타입스크립트를 사용하는 경우, 넣어준 값 이외에도 null값이 발생할 수 있다면 에러가 발생하기 때문에 

 

이 경우에는 다음과 같이 || 연산자를 사용하여 null일 경우에는 "" (빈 문자열)로 대체할 수 있도록 해야 한다.