React 작업을 진행하며, 자식 컴포넌트에서 사용될 ref
를 부모 컴포넌트에서 선언해야 하는 구조였다.
const ref = useRef("")
<Component ref={ref} />
위와 같은 구조로 ref
를 전달하니 에러가 발생했고...
찾아보니 자식 컴포넌트에 ref
를 전달하려면 컴포넌트를 선언할 때 React.forwardRef
를 사용해야한다는 답변을 받았다.
const Component = React.forwardRef(
(
{ props들 }: PropType,
ref: ForwardedRef<Ref Type>
) => (
<사용될 컴포넌트 내용>
)
);
위와 같은 구조로 선언하니 정상적으로 ref를 사용할 수 있었으며, TypeScript
를 사용하지 않는다면, Type부분만 제거하면 된다.
해결완료!