Javascript ReactJS:更改字段的特征

Javascript ReactJS:更改字段的特征,javascript,reactjs,Javascript,Reactjs,我有一个表单,有三个字段 两个字段取决于第一个字段的选择。 如果第一个字段设置为true,那么其他两个字段必须禁用=false和required=true,否则相反 因此,我: constructor(props){ super(props); this.state = { requiredData: false } this.handleChange = this.handleChange.bind(this) } handleChange(

我有一个表单,有三个字段

两个字段取决于第一个字段的选择。 如果第一个字段设置为true,那么其他两个字段必须禁用=false和required=true,否则相反

因此,我:

 constructor(props){
    super(props);
    this.state = {
      requiredData: false
    }
    this.handleChange = this.handleChange.bind(this)
  }

handleChange(selected){
    console.log('selected', selected)
    const { requiredData } = this.state
    this.setState({
      requiredData: selected
    })
    console.log('this.state',this.state)
  }


render()
{
 {
        name: 'SelfCertification.Contract',
        col: ["lg-6", 'md-6', 'sm-12'],
        label: "A Contratto",
        required: true,
        validate: FieldValidation.required,
        ..._common,
        CustomOnChange: selected => {
        handleChange: this.handleChange(selected)}
      },
      {
        name: 'SelfCertification.Contract.StartDate',
        col: ["lg-4", 'md-4', 'sm-12'],
        label: "Data Inizio",
        disabled: this.state.requiredData  ? false : true,
        required: this.state.requiredData  ? true : false,
        component: Fields.Text,
      },
      {
        name: 'SelfCertification.Contract.EndDate',
        col: ["lg-4", 'md-4', 'sm-12'],
        label: "Data Fine",
        disabled:  this.state.requiredData  ? false : true,
        required: this.state.requiredData  ? true : false,
        component: Fields.Text,
      },

//...

}
现在使用此代码,因此如果将其设置为选中的true(在
SelfCertification.Contract
中),则字段(
SelfCertification.Contract.StartDate,SelfCertification.Contract.EndDate
)正确
disable:false/required:true
但是如果我在字段中写入,
SelfCertification.Contract
的单选按钮就会消失。 而且,如果我再次更改我的第一个选择,字段不会返回到状态
disable:true/required:false

我该怎么办

我想要得到的:

Field1 (SelfCertification.Contract):
o Yes 
o No

Field2 (SelfCertification.Contract.StartDate or SelfCertification.Contract.EndDate)
disabled: true,
required: false.


Field1 (SelfCertification.Contract):
X Yes 
o No

Field2 (SelfCertification.Contract.StartDate or SelfCertification.Contract.EndDate)
disabled: false,
required: true.
 

Field1 (SelfCertification.Contract):
o Yes 
X No

Field2 (SelfCertification.Contract.StartDate or SelfCertification.Contract.EndDate)
disabled: true,
required: false.