# reactRefs

# useRef

# Forwarding Refs

For automatically passing a ref through a component to one of its children.

It can be useful for some reusable component libraries.

const FancyButton = React.forwardRef((props, ref) => (
  // When the ref is attached, ref.current will point to the <button> DOM node.
  <button ref={ref} className="FancyButton">
    {props.children}
  </button>
));

// You can now get a ref directly to the DOM button:
const ref = React.createRef();
<FancyButton ref={ref}>Click me!</FancyButton>;

1
2
3
4
5
6
7
8
9
10