order of lifecycle methods in react code example

Example 1: lifecycle methods react

Every component in React goes through a lifecycle of events. I like to think of them as going through a cycle of birth, growth, and death.

MountingBirth of your component
UpdateGrowth of your component
UnmountDeath of your component

Example 2: lifecycles if reactjs

class Clock extends React.Component {
  constructor(props) {
    super(props);
    this.state = {date: new Date()};
  }

  componentDidMount() {  }
  componentWillUnmount() {  }
  render() {
    return (
      <div>
        <h1>Hello, world!</h1>
        <h2>It is {this.state.date.toLocaleTimeString()}.</h2>
      </div>
    );
  }
}

Example 3: react lifecycle

constructor(props) {
  super(props);
  // Don't call this.setState() here!
  this.state = { counter: 0 };
  this.handleClick = this.handleClick.bind(this);
}