Revision history [back]

You can prevent the useEffect function from being triggered twice by adding a second parameter to the useEffect hook. This second parameter is an array of dependencies that the useEffect hook depends on.

If you pass an empty array as the second parameter, the hook will only be run once, when the component mounts. If you pass a non-empty array, the hook will be run every time any of the dependencies change, but it will not be run on mount or on unmount.

For example, if you only want the useEffect hook to run when a specific prop or state value changes, you can add that value to the array of dependencies.

useEffect(() => {
  // your code here
}, [specificPropOrStateValue]);

If you don't need any dependencies, you can pass an empty array as the second parameter.

useEffect(() => {
  // your code here
}, []);