Xtykutl

I have checked various forums to resolve this issue, but I could not find an example where the poster had literally copy and pasted from React docs.

I have included a snippet of my code.

When I hover over the checkbox it goes berserk and has seizure (almost like flashing). When I click it, I do not believe onChange fires, because there is no output to the console. The checkbox code was copied and pasted directly from https://reactjs.org/docs/forms.html.

If I manage to click the checkbox during its flashing fit the entire disappears.

Any help will be appreciated. I am hoping this has been ansered elsewhere, I just can't seem to find it.

class LoginPage extends React.Component {

constructor(props) {

    super(props);



    this.state = {

        username: '',

        password: '',

        submitted: false,

        isGoing: true,

    };



    this.handleInputChange = this.handleInputChange.bind(this);

}





handleInputChange(event) {

    console.log("handle input change")

    const target = event.target;

    const value = target.type === 'checkbox' ? target.checked : target.value;

    const name = target.name;



    this.setState({

        [name]: value

    });

}





render() {



    return (

      <span>

        <input

            name="isGoing"

            type="checkbox"

            checked={this.state.isGoing}

            onChange={this.handleInputChange} 

        />

        <label>Checkbox</label>

      </span>

    );

I don't think this should make a difference, but I am using redux for much of my apps state.

Thanks!