component did mount hook react code example

Example 1: react hooks componentdidmount

// import useEffect from 'react';

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

Example 2: component did mount in hooks

For componentDidMount
useEffect(() => {
  // Your code here
}, []);

For componentDidUpdate
useEffect(() => {
  // Your code here
}, [yourDependency]);

For componentWillUnmount
useEffect(() => {
  // componentWillUnmount
  return () => {
     // Your code here
  }
}, [yourDependency]);

Example 3: useeffect componentdidmount

import React, { useState, useEffect } from 'react';
function Example() {
  const [count, setCount] = useState(0);

  // Similar to componentDidMount and componentDidUpdate:  
  useEffect(() => {    
    // Update the document title using the browser API    
    document.title = `You clicked ${count} times`;  
  });

  );
}

Example 4: component did update hooks

import React, { useState, useEffect } from 'react';

function Example() {
  const [count, setCount] = useState(0);

  // Similar to componentDidMount and componentDidUpdate:
  useEffect(() => {
    // Update the document title using the browser API
    document.title = `You clicked ${count} times`;
  },[count]); // use dependency array to watch for state changes on this part of state

  return (
    

      
You clicked {count} times
       setCount(count + 1)}>
        Click me
      
    
  );
}

Example 5: react hook will mount

const useComponentWillMount = (func: (params?: any) => any) => useMemo(func, []);

Example 6: componentdidmount in hooks

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