Skip to content

Instantly share code, notes, and snippets.

@evgeniy2002
Created March 15, 2024 09:49
Show Gist options
  • Save evgeniy2002/f1dbc199403c13593c95e761af5f41c2 to your computer and use it in GitHub Desktop.
Save evgeniy2002/f1dbc199403c13593c95e761af5f41c2 to your computer and use it in GitHub Desktop.

Revisions

  1. evgeniy2002 created this gist Mar 15, 2024.
    19 changes: 19 additions & 0 deletions arrayRefs.ts
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,19 @@
    type RefArray<T> = MutableRefObject<(T | null)[]>;

    function useArrayRef<T>(): [RefArray<T>, (index: number, ref: T | null) => void] {
    const refs: RefArray<T> = React.useRef([]);

    const setRef = (index: number, ref: T | null) => {
    if (ref) {
    refs.current[index] = ref;
    } else {
    refs.current[index] = null;
    }
    };

    return [refs, setRef];
    }

    const [refs, setRef] = useArrayRef<HTMLDivElement>();

    <div ref={(ref) => setRef(item.id, ref as HTMLDivElement)}></div>