React:在其他复选框的术语中更改复选框的状态

时间:2017-04-20 07:02:55

标签: reactjs material-ui

我使用材料ui的复选框,我想在选中其他复选框时更改复选框的状态。

<Checkbox label="Etape 1 terminée" value={this.state.valueCheckStepOne} onCheck={this.onCheckStepOne} />



<Checkbox label="Etape 2 terminée" value={this.state.valueCheckStepTwo} onCheck={this.onCheckStepTwo} />

onCheckStepOne = (value) => {
    this.setState({
        valueCheckStepOne: value.target.checked

    });      
onCheckStepTwo = (value) => {
        this.setState({
            valueCheckStepTwo: value.target.checked
        }); 

// Here I want to change the state of valueCheckStepOne 
       componentDidUpdate() {        
        if (this.state.valueCheckStepTwo == true) {
            this.setState({
                valueCheckStepOne : true
            })
        }       
    }

如果我这样做,我的应用程序错误! 你有好主意吗 ?谢谢

1 个答案:

答案 0 :(得分:0)

您可以将 onCheckStepTwo 编写为

onCheckStepTwo = (event) => {
    const value = event.target.checked
    const stateUpdates = {
        valueCheckStepTwo: value
    }
    if (value) {
        stateUpdates.valueCheckStepOne = true
    }
    this.setState(stateUpdates);
} 

如果将 valueCheckStepTwo 的值设置为true,则会更改 valueCheckStepOne 的状态。您可以根据自己的要求修改逻辑。