Search code examples
reactjsreact-hooksrefuse-effect

No eslint warning when ref is missing in useEffect dependency

I have one doubt about ref in useEffect. Do I need to add it to dependency?

const App = () => {
  const ref = useRef();
  useEffect(() => {
    //do something about ref
  }, []); //<-- ref is not here
}

the above code doesn't give any eslint warning. is ref exempted in the dependency?

Solution

  • The short answer is yes, you don't have to add ref to the dependencies array.

    For deeper understanding you can read A Complete Guide to useEffect by Dan Abramov. A quote from there, that answers your question:

    (You may omit dispatch, setState, and useRef container values from the deps because React guarantees them to be static. But it also doesn’t hurt to specify them.)