Unable to get a ref to an input component

This happens when the editor is unable to create a ref to an input component. This is likely because of one of the following reasons:

  • The input component is wrapped in a higher order component (HOC), which does not delegate a focus() method to the component it wraps. See this guide on how to forward a ref inside a higher order component.
  • The input component is a function component. Since function components cannot be given refs, the input component must be wrapped using React.forwardRef in order to specify which element should receive focus. Note: keep in mind that the forwarded ref must be attached to an element that actually exposes a .focus() method.

Was this article helpful?