React ref

React.useRef hook

ref로 DOM 다루기
리액트를 사용하는 프로젝트에서 가끔씩 DOM을 직접 선택해야 하는 상황이 발생한다.
그럴때 리액트에서 ref를 사용한다

Vanilla js -> document.get/ documnet.query
React -> useRef / ref

const root = document.querySelector('#root')

  function App() {
    const inputRef = React.useRef()
    React.useEffect(() => {
      inputRef.current.focus()
      
    return (
      <React.Fragment>
        <input ref={inputRef} />
      </React.Fragment>
    )
  }
  ReactDOM.render(<App />, root)

1. useRef()를 inputRef 변수에 넣고, 실제 input에다 ref값으로 설정해준다
2. ref객체의 .current 값은 원하는 DOM을 가르키게 된다