React/문법
[React Hooks] useRef : 요소값 가져오기
슬래기
2022. 3. 20. 16:11
React Hook API에는 useRef라는 API 함수를 제공해준다.
javascript를 사용하다보면 선택자를 이용해서 요소의 값을 가져오는 경우가 많다.
예를 들어 getElementById, querySelector 를 사용한다.
React를 사용할때도 이와같은 요소의 값을 가져오는 경우가 있는데 이럴경우 useRef를 사용하면 된다.
사용법은 간단하다.
import에 useRef를 가져오고,
아래와 같이 ReactHook function에 선언을 해주고 return해주는 요소에 ref로 주입해주면 된다.
const useRef = useRef();
return(
<input ref = {useRef} > useRef테스트 </input>
)
- javascript에서 특정 Dom을 선택하는 역할 ex) getElementById, querySelector
- 특정 DOM에 접근할 때 사용한다.
- 외부 라이브러리 사용할때 유용하다.
- 원하는 위치에 ref={} 의 형태로 작성하면 된다.