useMergeRefs

인자로 주어진 여러 개의 ref를 하나로 병합할 때 활용할 수 있는 커스텀 훅입니다.

Code

🔗 실제 구현 코드 확인

Interface

typescript

const useMergeRefs: <T = unknown>(...refs: React.Ref<T>[]) => (instance: T | null) => void

Usage

typescript

import React, { forwardRef, useRef } from 'react';
import { useMergeRefs } from '@modern-kit/react';

interface Props {
  /* ... */
}

const Example = forwardRef<HTMLDivElement, Props>((props, ref) => {
  const childRef = useRef<HTMLDivElement | null>(null);

  return <div ref={useMergeRefs(childRef, ref)}>{/* ... */}</div>;
});