useRef

송지현·2022년 8월 26일
0

useRef란?

특정 DOM을 가리킬 때 사용하는 Hook함수이다. 사용하는 예로는 대상에 대한 포커스 설정, 특정 엘리먼트의 크기나 색상을 변경할 때 사용한다.

javascript의 getElementById()처럼 컴포넌트의 어떤 부분을 선택할 수 있게 하는 방법이다. DOM에 접근할 수 있도록 하는 기능을 가진 hook!
리액트에 있는 모든 컴포넌트는 reference element를 갖고 있어서 어떤 컴포넌트에 ref={변수명}을 넣어준다면, 리액트에서 해당 컴포넌트를 참조하게 됩니다. 다음은 useRef 사용방법이다.

import React, {useRef} from 'react';

컴포넌트 최상단에 react와 같이 import를 하고 useRef()를 선언한다.

const here = useRef();

DOM에 접근 할 태그 및 컴포넌트에 ref를 선언

 <input ref={here} placeholder="how are you" />
profile
열심히 구르는 감자

0개의 댓글