목록Ref로 DOM 다루기 (1)

코딩을 쉽게 해보자

[React-beta] Escape Hatches - Ref로 DOM 다루기 [번역]

React는 컴포넌트를 자주 다루지 않아도 되도록 자동으로 DOM을 렌더 출력과 일치하도록 업데이트한다. 하지만 React에 의해 다뤄지고 있는 Dom elements를 접근해야 하는 경우가 있다. 예를 들어, 노드를 focus하거나 스크롤, 이것의 크기나 위치를 측정할 때다. React에서는 이러한 방법을 기본적으로 하는 방법을 제공하지 않으므로, ref를 Dom node에 사용해야할 것이다. 노드에 ref를 가져오기 React에 의해 다뤄지는 DOM node에 접근하기 위해서는 useRef를 import 해야한다. 그 이후, 컴포넌트 안에서 ref를 선언하고, 마지막으로 DOM node에 ref 어트리뷰트를 넘긴다. import { useRef } from 'react'; const myRef = u..
React 2023. 2. 10. 17:44
이전 Prev 1 Next 다음