useRefHandler.js

import React from "react";
import ReactDOM from "react-dom";

// REF
const useRefHandler = () => {
  const ref = React.useRef();

  const [ready, setReady] = React.useState(false);

  const set = (node) => {
    setReady(Boolean(node));

    ref.current = node;
  };

  return { set, get: ref, ready };
};

// EXAMPLE 
function App() {
  const ref = useRefHandler();

  const [loading, setLoading] = React.useState(true);

  React.useEffect(() => {
    setTimeout(() => setLoading(false), 3000);
  }, []);

  React.useEffect(() => {
    if (ref.ready) {
      console.log(ref.get);
    }
  }, [ref.ready]);

  if (loading) {
    return "loading..";
  }

  return <span ref={ref.set} />;
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);