Just add an empty array
after the callback function
separated by a comma
useEffect(callback, []);
useEffect(()=>{}, []);
And if you get any warning for missing dependency
, add that inside the array
useEffect(()=>{
// your code here
}, [dependency_item]);
If the missing items are more than one, put all of them with comma seperated.
useEffect(()=>{
// your code here
}, [dependency_item1, dependency_item2, dependency_item3]);
Why do you need to run useEffect() only once?
When you setState inside useEffect() from a data source, it will be continuously updating with the source value, and outside the useEffect() if you have an onChange event handler to setState to another value- that won't work. To solve this, you need to call useEffect() only once.
Read more on React Section | tradecoder
Go back to Developers Hub | tradecoder
If you find this post helpful, please feel free to share it