Articles → REACT.JS → Setstate() Function In React.Js

Setstate() Function In React.Js






What Is The UI Element State?




  1. A button can be in an enabled or disabled state
  2. A label contains some value and when the value is changed the state is also changed
  3. A checkbox is either in a checked or unchecked state

Purpose





Example




import React, { Component } from 'react';
import ReactDOM from 'react-dom'


class Test extends Component {

    state = {
        Increment: 0
    };

    constructor() {
        super()
        this.incrementTime = this.incrementTime.bind(this);
    }

    incrementTime() {
            this.setState({ Increment: this.state.Increment + 1 });
    }

    render() {
        return (
            <React.Fragment>
                <label>{this.state.Increment}</label>
                <br/>
                <button onClick={this.incrementTime}>Click Me</button>
            </React.Fragment>
        );
    }


}

ReactDOM.render(<Test/>, document.getElementById('root'));



Output


Picture showing the output of setState() function in react.js
Click to Enlarge


Posted By  -  Karan Gupta
 
Posted On  -  Friday, August 6, 2021

Query/Feedback


Your Email Id
 
Subject
 
Query/FeedbackCharacters remaining 250