Life cycle methods and Hooks - florypaul/ReactJS GitHub Wiki
- fetching data on the mount,
- cleaning up before the component unmounts,
- sanitizing props when the component updates
https://www.codegrepper.com/code-examples/javascript/react+hook+unmount
https://www.opcito.com/blogs/lifecycle-methods-and-hooks-in-react?success=true - gave comment
componentDidMount
A lifecycle method runs or executes after the component is mounted and rendered to the DOM. It is called only once during the component's lifecycle after the component mounting is done.
componentDidUpdate
It is a lifecycle method that executes after an update in the component and checks if a specific prop or state has changed.
ComponentWillUnmount
It is a lifecycle method that runs or executes when component is about to be removed or unmounted from the DOM. It is called only once during the lifecycle of a component.
// passing an empty array as second argument triggers the callback in useEffect
// only after the initial render thus replicating componentDidMount lifecycle behaviour
useEffect(() => {
if(!props.fetched) {
props.fetchRules();
}
console.log('mount it!');
}, []);
// componentDidUpdate
useEffect({
your code here
})
// For componentDidUpdate
useEffect(() => {
// Your code here
}, [yourDependency]);
// For componentWillUnmount
useEffect(() => {
// componentWillUnmount
return () => {
// Your code here
}
}, [yourDependency]);