/Javascript/React/Toggle function react js

Toggle function react js

class Toggle extends React.Component {
  constructor(props) {
    super(props);
    this.state = {isToggleOn: true};

    // This binding is necessary to make `this` work in the callback    this.handleClick = this.handleClick.bind(this);  }

  handleClick() {    this.setState(state => ({      isToggleOn: !state.isToggleOn    }));  }
  render() {
    return (
      <button onClick={this.handleClick}>        {this.state.isToggleOn ? 'ON' : 'OFF'}
      </button>
    );
  }
}

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

Source: reactjs.org

Similar codes

0 vote182 views1 answer
Set default types react
Javascript React
-1 vote190 views1 answer
React slick npm
Javascript React
1 vote164 views1 answer
React map component in
Javascript React
15 votes188 views2 answers
UseReducer() hook react
Javascript React
0 vote185 views1 answer
Route guards in react
Javascript React
0 vote180 views1 answer
Ab mob react native expo
Javascript React
0 vote186 views3 answers
Error: Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops.
Javascript React
17 votes196 views3 answers
React router url params
Javascript React
1 vote170 views2 answers
React native map array of objects
Javascript React
0 vote169 views1 answer
React native force vertical
Javascript React