Ref Forwarding

Expand your knowledge about refs and learn how to automatically pass a ref through a component to one of its children.

Ref forwarding via React.forwardRef()

Ref forwardingReferences to a component or a DOM element enables passing a reference through a component to a child component. This will not be necessary in most cases, but it can become of interest if you are creating reusable component libraries.

A ref is forwarded via React.forwardRef() and is passed a function as a parameter during this process. The ref passes props, as well as the ref itself, to the forwardRef function.

This sounds incredibly cumbersome, so let us first look at an example. ...