목록REACT (1)

개발하는 무민

[React] Ref 사용법 (forwardRef, ForwardRefRenderFunction, useRef)

Ref란? 리액트에서 DOM 요소나 클래스 컴포넌트의 인스턴스에 직접 접근하기 위한 방법을 제공. 컴포넌트 내부의 특정 DOM 요소에 직접 접근하여, 해당 요소를 조작하거나 해당 요소의 정보를 얻을 수 있다. Ref는 주로 폼 입력 처리, 포커스 관리, 애니메이션 직접 조작 등에 사용한다. 예시 코드 1. forwardRef를 사용하는 방식 컴포넌트를 생성할 때 바로 Ref를 전달할 수 있는 함수이다. props와 Ref 두개의 매개변수를 받는다. 주로 함수 컴포넌트에서 사용되며, 컴포넌트 내부에서 ref를 접근할 수 있게 해준다. → 외부에서 Ref를 통해 내부의 input 요소에 접근이 가능하다. - ref를 사용한 FancyInput 컴포넌트 예시 import React, { forwardRef }..
Development/React 2023. 11. 14. 17:42
이전 Prev 1 Next 다음