Create A Toggle Button in a React Class

react-toggle-button.md

Create a Toggle Button in a React Class

import React from 'react';
import ReactDOM from 'react-dom';

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

  handleClick = () => {
    // todo
    this.setState({
      on: !this.state.on
    });
  }

  render() {
    const { on } = this.state;
    return (
      <button
        onClick={() => this.handleClick()}
      >{on ? "Off": "On"}</button>
    );
  }
}

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