我有一个看起来像这样的组件:
const MyComponent = props => {
const { checked, onChange, id } = props;
const [isChecked, setChecked] = useState(false);
useEffect(() => {
onChange && onChange({ isChecked: !!checked, id });
setChecked(checked);
}, [checked]);
const childProps = {
id,
isChecked
};
return <ChildComponent {...childProps} />;
};
详尽的 deps lint 规则并不令人满意:
React Hook useEffect 缺少依赖项:
id
和onChange
. 包括它们或删除依赖项数组。(react-hooks/exhaustive-deps)eslint
我知道这一点id
并且onChange
不会改变,因此将它们添加到依赖项数组似乎没有必要。但规则不是警告,而是明确的指示去做某事。
是 ESLint 规则:
1)在这种情况下过于谨慎和有点愚蠢,所以可以忽略吗?
2) 突出最佳实践——例如,如果父组件的变化意味着 id将在未来的某个时刻发生变化,那么为了最大限度地减少将来可能发生的意外错误?
3) 显示当前代码的实际/可能问题?