'"react-hooks/exhaustive-deps": "warn" for eslint-plugin-react-hooks is too sensitive?
useEffect(() => {
const apiCall = async () => {
try {
let newSearchFormOptions = { ...searchFormOptions };
...
setSearchFormOptions(newSearchFormOptions);
} catch (e) {
setPageState({ error: e.error });
} finally {
setPageState({ isLoading: false });
}
};
apiCall();
}, []);
Before I added eslint to the project, above codes doesn't have eslint issue. After adding eslint rule into project, it shows "React Hook useEffect has a missing dependency: 'searchFormOptions'." However, searchFormOptions is the state and setSearchFormOptions will update it, which make "apiCall" invoked again and again. I know that we can use eslint to disable this warning, but my concern is whether eslint rule is too sensitive while I plan to trigger "apiCall" only one time when component is mounted. Do we need to rely on the eslint rule or we need to double check it by ourselves and then use eslint to disable this warning or do we have any other workaround?
Thanks in advance.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
