5.1 어떤상황에 ref를 사용할까?

• Dom 선택자로 Dom에 이름을 달아주는 것이라고 보면됩니다. Dom자체에 변수를 입력하여 나중에 css를 변경하고 싶거나 자바스크립트 이벤트를 달아주는등을 할수 있습니다.
• 특정 tag에 focus 등의 이벤트 적용하기,
• 스크롤 박스 조작하기
• canvas 요소에 그림그리기 등

5.2 class형에서의 ref

5.2.1 콜백함수를 통한 ref 설정

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

을 사용하면 이 이후부터는 this.input은 위에 적어놓았던 input의 DOM을 가르키게 됩니다. 이름은 this.input에서 input만 바꾸면 원하는대로 사용도 가능합니다.

5.2.2 createRef()를 통해 설정

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

이렇게도 작성이 가능합니다.

5.3 함수형 에서 의 ref

함수형에서는 hook를 사용하여 ref를 설정합니다.
useRef()를 이용하여 createRef()를 대체하여 사용합니다.