I simply want to change the state of my app with a handleChange method for multiple checkboxes.
My state is changed from false to true when I click each of my checkboxes, but when I un-check it, my state doesn't change to reflect it and I cant seem to figure out why!
import React, { Component } from "react";
export class StepOne extends Component {
constructor(props) {
super(props);
this.state = {
box1: false,
box2: false,
box3: false,
};
}
handleChange = (evt) => {
const box = evt.target.name;
this.setState({ [box]: !this.state.box });
};
render() {
return (
<div>
<input type="checkbox" name="box1" onChange={this.handleChange} />
<input type="checkbox" name="box2" onChange={this.handleChange} />
<input type="checkbox" name="box3" onChange={this.handleChange} />
</div>
);
}
}
Aucun commentaire:
Enregistrer un commentaire