React Updating Render Method | Components Lifecycle

The Render Method -

The render() method is the only required method in a class component.

The render() method is called when a component gets updated and re-render the HTML to the DOM including the new changes.

Explore to Understand  - React Lifecycle Components

Note: The render() will not be invoked if shouldComponentUpdate() returns false.

As an Example,

class Header extends React.Component {

    constructor(props) {

      super(props);

      this.state = {color: "red"};

    }

    changeColor = () => {

      this.setState({color: "blue"});

    }

    render() {

      return (

        <div>

            <h2>My Color is {this.state.color}</h2>

            <button type="button" onClick={this.changeColor}>Change color</button>

        </div>

      );

    }

  }

Result of this example is – My color is blue