더북(TheBook)

5.2.1 사용법

 

ref를 달아야 하는 DOM에 ref 속성을 추가할 때는 props를 설정하듯이 하면 됩니다. ref 값으로는 콜백 함수를 전달합니다. 콜백 함수는 ref를 파라미터로 가지며, 콜백 함수 내부에서 컴포넌트의 멤버 변수에 ref를 담는 코드를 작성합니다.

<input ref={(ref) => {this.input=ref}}></input>

 

어때요. 간단하죠? 이렇게 하면 앞으로 this.inputinput 요소의 DOM을 가리킵니다. ref 이름은 자유롭게 지정합니다. DOM 타입과 관계없이 this.superman = ref처럼 마음대로 지정하면 됩니다.

신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.