"react-hooks/exhaustive-deps": "warn" for eslint-plugin-react-hooks is too sensitive?

Question

  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.

Answer 1

Quote by react team member:

You can put

// eslint-disable-next-line react-hooks/exhaustive-deps

before the violating line if there is a good reason. Usually disabling it is a mistake and will significantly bite you later. (Most cases where people think it's safe to disable are not safe and lead to stale closures.)

Sometimes when I know I want to run what is inside the effect only once during mount, I have disabled it.