/Javascript/React/React Class components LifeCycles

React Class components LifeCycles

Implementing state lifecycle in react class component

class Example extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      count: 0
    };
  }

  componentDidMount() {
    document.title = `You clicked ${this.state.count} times`;
  }
  componentDidUpdate() {
    document.title = `You clicked ${this.state.count} times`;
  }

  render() {
    return (
      <div>
        <p>You clicked {this.state.count} times</p>
        <button onClick={() => this.setState({ count: this.state.count + 1 })}>
          Click me
        </button>
      </div>
    );
  }
}

Source: reactjs.org

React Class components LifeCycles

1) componentDidMount() {}
2) componentDidUpdate(prevProps, prevState, snapshot) {}
3) shouldComponentUpdate(nextProps, nextState) {}
4) componentWillUnmount() {}

Source: medium.com

Similar codes

0 vote205 views3 answers
How to get svg from pucblic folder in react
Javascript React
32 votes202 views1 answer
React router command
Javascript React
11 votes195 views3 answers
React Hook "useState" is called in function "cardState" which is neither a React function component or a custom React Hook function
Javascript React
16 votes214 views3 answers
What does the useReducer do in react
Javascript React
61 votes188 views6 answers
Reactjs router
Javascript React
0 vote203 views1 answer
Form.Control textarea react bootstrap
Javascript React
0 vote204 views1 answer
Set meterial icon color change onClick react
Javascript React
1 vote178 views3 answers
Antd react
Javascript React
31 votes221 views3 answers
React mui icons
Javascript React
0 vote191 views2 answers
Why we use react js
Javascript React