🚀 LEVEL UP TO SENIOR:Unlock 500+ Advanced Practical Challenges & Expert Masterclasses.
🎓 COURSERA PARTNER:Earn professional Google, Meta, and IBM certificates to supercharge your resume.
REFERENCEreact

react Documentation

LOADING ENGINE...

React ComponentDidUpdate

Master React components, hooks, and best practices.

ComponentDidUpdate

Author

Pascual Vila

Frontend Instructor.

componentDidUpdate is a lifecycle method of class components that runs after the component has been updated. It can be used to perform actions based on state or prop changes.

Example of componentDidUpdate:

          {`import React, { Component } from "react";
          
          class Counter extends Component {
            constructor(props) {
              super(props);
              this.state = { count: 0 };
            }
            
            componentDidUpdate(prevProps, prevState) {
              if (this.state.count !== prevState.count) {
                console.log("The counter has changed to:", this.state.count);
              }
            }
            
            render() {
              return (
                <div>
                  <h1>Counter: {this.state.count}</h1>
                  <button onClick={() => this.setState({ count: this.state.count + 1 })}>Increment</button>
                </div>
              );
            }
          }
          
          export default Counter;`}