react/exhaustive-deps Correctness
作用
检查诸如 useEffect 之类的 Hooks 的依赖项列表。
为什么这不好?
像 useEffect 这样的 React Hooks 需要将依赖项列表作为参数传入。这个列表用于判断副作用何时需要重新运行。如果列表缺失或不完整,副作用可能会比必要时更频繁地运行,或者根本不运行。
示例
此规则的错误代码示例:
javascript
function MyComponent(props) {
useEffect(() => {
console.log(props.foo);
}, []);
// `props` 缺少在依赖数组中
return <div />;
}此规则的正确代码示例:
javascript
function MyComponent(props) {
useEffect(() => {
console.log(props.foo);
}, [props]);
return <div />;
}配置
此规则接受一个包含以下属性的配置对象:
additionalHooks
type: string
default: null
可选地提供一个用于检查的额外 hooks 的正则表达式。
如何使用
To enable this rule using the config file or in the CLI, you can use:
json
{
"plugins": ["react"],
"rules": {
"react/exhaustive-deps": "error"
}
}ts
import { defineConfig } from "oxlint";
export default defineConfig({
plugins: ["react"],
rules: {
"react/exhaustive-deps": "error",
},
});bash
oxlint --deny react/exhaustive-deps --react-plugin版本
此规则在 v0.12.0 中添加。
