如何设置默认复选框“ ReactJS”？

我将状态设置为any []类型。并在构造函数中将状态设置为null。

onServiceChange = (e) => {
    const {value} = e.target;
    const index = this.state.services.indexOf(value);
    const services = this.state.services.filter(item => item !== value);
    this.setState(prevState => ({
        services: index === -1 ? prevState.services.push(value) && prevState.services : this.state.services.filter(item => item !== value)
    }))
}

在输入元素中

this.onServiceChange（e）} /> this.onServiceChange（e）} /> this.onServiceChange（e）} /> this.onServiceChange（e）} />

一段时间后，我想通了。以为这可能对大家有帮助:)

 <div className="form-group">
          <div className="checkbox">
            <label><input type="checkbox" value="" onChange={this.handleInputChange.bind(this)}  />Flagged</label>
            <br />
            <label><input type="checkbox" value=""  />Un Flagged</label>
          </div>
        </div

handleInputChange（event）{

console.log("event",event.target.checked)   }

上述句柄在选中或未选中时为您提供true或false的值

您可以将“ true”或“”传递给输入复选框的checked属性。空引号（“”）将被理解为false，并且该项目将被取消选中。

let checked = variable === value ? "true" : "";
<input
     className="form-check-input"
    type="checkbox"
    value={variable}
    id={variable}
    name={variable}
    checked={checked}
/>
<label className="form-check-label">{variable}</label>

除了正确的答案，您也可以执行：P

<input name="remember" type="checkbox" defaultChecked/>

要与复选框互动，您需要在更改复选框后更新其状态。要使用默认设置，可以使用defaultChecked。

一个例子：

<input type="checkbox" defaultChecked={this.state.chkbox} onChange={this.handleChangeChk} />