[react] ref 기초 정리(스크롤 관리, 포커싱 관리, 반복 DOM)

react로 DOM에 접근하여 스크롤 이벤트, 포커싱 등을 할 수 있는 방법이 바로 ref를 사용하는 방법이다. 기본적인 React에서 부모 자식 컴포넌트의 상호작용은 props로 한다. 그리고 자식을 수정하기 위해서는 props의 값 변경을 통해 수행한다. 수정을 하는 것이 자식 컴포넌트가 아닌 DOM Element나 React Element인 경우도 있을 것이다. 이러한 경우에 ref를 통해 render 되는 html 태그(DOM Node, React Element)에 접근하는 것이 가능하다. 또한, Ref 자체가 단방향 흐름인 React에서 어떠한 오아시스 같은 역할을 하는지도 알아보자. 1. Ref 사용 시기 공식문서는 아래와 같은 시기에 사용을 권장한다. focus 하는 경우 input 태그 선..
Web/React 2023. 2. 20. 21:19
1
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
TAG more
«   2024/12   »
일 월 화 수 목 금 토
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31
글 보관함