Learner's notes on useEffect in React
useEffect
allows us to produce some side effects for our component. Anything that reaches outside of the component to do something. Like a network request or setting up timeouts and intervals. Their main job doesn't have to do with managing set or changing anything about the display of the component.
- By default useEffect runs after every re-render
We only run the code inside of the useEffect hook when the whenever the options inside of the array actually change, therefore, we can create a hook that only ever runs on mount by passing in an empty array.
If we need useEffect to only run during the initial render and not for re-renders, we can leave an empty arrray on the dependency list:
useEffect(() => {
console.log("call useEffect");
if (value >= 1) {
document.title = `New Messages (${value})`;
}
}, []);