TIL-26

20210629 - React Ref

Ref 생성하기

• Ref는 React.createRef()를 통해 생성되고
  ref 어트리뷰트를 통해 React 엘리먼트에 부착
• 컴포넌트의 인스턴스가 생성될 때 Ref를 프로퍼티로서 추가
  --> 컴포넌트의 인스턴스의 어느 곳에서도 Ref에 접근할 수 있음

class MyComponent extends React.Component {
  constructor(props) {
    super(props);
    this.myRef = React.createRef();
  }
  render() {
    return <div ref={this.myRef} />;
  }
}

Ref 접근하기

• render 메서드 안에서 ref가 엘리먼트에게 전달되었을 때,
  그 노드를 향한 참조는 ref의 current 어트리뷰트에 담기게 됨

const node = this.myRef.current;