React Hooks – Ref is not available inside useEffect

Question

You should use useCallback instead of useRef as suggested in the reactjs docs.

React will call that callback whenever the ref gets attached to a different node.

Replace this:

const elRef = useRef(null);
useEffect(() => {
    console.log("ref", elRef.current);
}, [elRef.current]);

with this:

const elRef = useCallback(node => {
    if (node !== null) {
        console.log("ref", node); // node = elRef.current
    }
}, []);