[React] ref

Ref

render 메서드에서 생성된 DOM 노드나 React 엘리먼트에 접근하는 방법을 제공

 

• 포커스, 텍스트 선택영역, 혹은 미디어의 재생을 관리할 때.
• 애니메이션을 직접적으로 실행시킬 때.
• 서드 파티 DOM 라이브러리를 React와 같이 사용할 때.

선언적으로 해결될 수 있는 문제에서는 ref 사용을 지양

 

Ref 생성

React.createRef()를 통해 생성되고 ref 어트리뷰트를 통해 React 엘리먼트에 부착됩니다. 보통, 컴포넌트의 인스턴스가 생성될 때 Ref를 프로퍼티로서 추가하고, 그럼으로서 컴포넌트의 인스턴스의 어느 곳에서도 Ref 접근 가능

위와 같이 선언? 후에 사용된 함수내에서 this.box.scrollTop나 this.inputName.focus의 값에 변화를 줄 수 있다.