jsx for detecting change in checkbox

check.jsx

/ External Dependencies
import React, { Component } from 'react';

// Internal Dependencies
import './style.css';


class HelloWorld extends Component {

  static slug = 'adna_hello_world';

  constructor(props) {
    super(props);
    this.checkedRef = React.createRef();
    this.state = {isChecked: false};
    this.handleChecked = this.handleChecked.bind(this);
  }

  handleChecked() {
    this.setState({ isChecked: !this.state.isChecked });
    console.log(this.state.isChecked);
  }

  componentDidUpdate() {
    console.log('Box was checked');
  }

  render() {
    
    return (
        <div>
          <label className="switch">
            <input ref={this.checkRef} type="checkbox" onChange={this.handleChecked} />
            <span className="slider"></span>
          </label>
        </div>
    );
  }
}

export default HelloWorld;