← Back to rules

react/forward-ref-uses-ref 正确性

An auto-fix is available for this rule.

它做了什么

要求使用 forwardRef 包装的组件必须包含 ref 参数。
省略 ref 参数通常是一个错误，
且不使用 ref 的组件无需通过 forwardRef 包装。

为什么这是个问题？

省略 ref 参数会使 forwardRef 包装变得多余，
可能导致混淆。

示例

此规则的 错误 代码示例：

var React = require("react");

var Component = React.forwardRef((props) => <div />);

此规则的 正确 代码示例：

var React = require("react");

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

var Component = React.forwardRef((props, ref) => <div />);

function Component(props) {
  return <div />;
}

如何使用

要通过配置文件或 CLI 启用 此规则，可以使用：

配置 (.oxlintrc.json)

{
  "plugins": ["react"],
  "rules": {
    "react/forward-ref-uses-ref": "error"
  }
}

CLI

oxlint --deny react/forward-ref-uses-ref --react-plugin

参考资料

• 规则源码