react/ensure-forward-ref-using-ref

Rule category

Correctness.

Requires that components wrapped with forwardRef must have a ref parameter.

This rule checks all React components using forwardRef and verifies that there is a second parameter.

Omitting the ref argument is usually a bug, and components not using ref don't need to be wrapped by forwardRef.

const Component = React.forwardRef((props) => {
  return <div />;
});

import { forwardRef } from "react";
 
const Component = forwardRef((props) => {
  return <div />;
});

const Component = React.forwardRef((props, ref) => {
  return <div ref={ref} />;
});

import { forwardRef } from "react";
 
const Component = forwardRef((props, ref) => {
  return <div ref={ref} />;
});