react/forward-ref-uses-ref
Require a component wrapped in forwardRef to take a ref parameter
has suggestions
forwardRef passes the parent's ref to your component as a second parameter. A component that only takes props drops it, so the parent's ref.current is never set. Either the ref parameter is missing or you don't need the wrapper.
The rule reports a function with exactly one parameter. Your editor offers two suggestions: add a ref parameter, or remove the forwardRef wrapper.
Configure#
Off by default. To turn it on:
bunfig.toml
[lint.rules]
"react/forward-ref-uses-ref" = "error" # or "warn"Examples#
example.jsx1 problem
import { forwardRef } from "react";
const TextInput = forwardRef(props => {forwardRef is used with this component but no ref parameter is set
return <input type="text" value={props.value} />;
});example.jsxNo problems
import { forwardRef } from "react";
const TextInput = forwardRef((props, ref) => {
return <input type="text" value={props.value} ref={ref} />;
});
const Label = props => <label>{props.text}</label>;