#8 React - React에서 DOM element 조작하기- useRef()

오늘은 React에서 DOM element를 조작하는 방법에 대해 정리해보려고 한다! 일단 기본적으로 바닐라 자바스크립트에서 DOM element를 조작하기 위해선 const input = document.getElementsByTagName("input"); 이런 식으로 getElementsBy~등을 사용해서 HTML의 DOM 요소를 조작할 수 있었다.

그렇다면 React에서는 어떻게 JSX의 DOM 요소를 조작할 수 있을까? 0. useRef()란?

React에서 DOM 요소를 조작하기 위해선 useRef()를 사용할 수 있다. 간단한 예제를 살펴보자. import React, { useRef, useEffect } from 'react'; function MyComponent() { // useRef를 사용하여 ref를 생성 const myRef = useRef(); useEffect(() => { // 컴포넌트가 렌더링된 후에 DOM 요소에 포커스를 줌 myRef.curren...