title | type | language | tags | cover | dateModified | ||
---|---|---|---|---|---|---|---|
React useComponentDidMount hook |
snippet |
react |
|
green-cabin-cow |
2021-10-13 |
Executes a callback immediately after a component is mounted.
- Use the
useEffect()
hook with an empty array as the second argument. This will execute the provided callback only once when the component is mounted. - Behaves like the
componentDidMount()
lifecycle method of class components.
const useComponentDidMount = onMountHandler => {
React.useEffect(() => {
onMountHandler();
}, []);
};
const Mounter = () => {
useComponentDidMount(() => console.log('Component did mount'));
return <div>Check the console!</div>;
};
ReactDOM.createRoot(document.getElementById('root')).render(
<Mounter />
);