The Checkbox component is used in forms when a users needs to select a true or false value.
Import React and the CheckBox Component.
Declare the CheckBox component. Any children will be rendered as the label to the right of the checkbox.
0
class ExampleOne extends React.Component {
1
state = { exampleOne: false };
3
_handleChange = (e) => this.setState({ [e.target.name]: e.target.value });
9
value={this.state.exampleOne}
10
onChange={this._handleChange}
12
<strong>Unchecked</strong>
14
This CheckBox default is unchecked.
20
class ExampleTwo extends React.Component {
21
state = { ExampleTwo: true };
23
_handleChange = (e) => this.setState({ [e.target.name]: e.target.value });
29
value={this.state.ExampleTwo}
30
onChange={this._handleChange}
32
<strong>Checked</strong>
34
This CheckBox default is checked.