Как я могу определить, какой флажок был выбран в вашем штате?

Question

Я использую response-native-elements флажок, у меня есть 2 флажка, и я хочу выбрать только один из них, и мне удалось сделать это, но я пытаюсь console.logтолько флажок, но он не работает, потому что они имеют два разных состояния, так как я могу определить, какой флажок был установлен в моем приложении, используя состояние?вот код:

Исходное состояние:

state: {
  single: false,
  married: false
}

Флажки:

 <CheckBox title="Single"
              checked={this.state.single}
              onPress={() => this.setState({ single: !this.state.single, 
              married: false})}/>

 <CheckBox title="Married"
              checked={this.state.married}
              onPress={() => this.setState({ married: !this.state.married, 
              single: false})}/>

У меня есть APIи я хочу разместить в нем данные, у него есть атрибут maritalStatus, и я хочу отправить либо женатое, либо одиночное как строковое значение на основе установленного флажка

Answer 1

Не думаю, что для этого нужно управлять двумя состояниями.В этом случае человек может быть женат или не женат.Так что вам нужно сделать что-то вроде этого

Если вы хотите, чтобы оба флажка были сняты при загрузке, то

state: {
  single: void 0,
}


<CheckBox title="Single"
              checked={this.state.single}
              onPress={() => this.setState({ single: !this.state.single})}/>

 <CheckBox title="Married"
              checked={this.state.single !== undefined && !this.state.single}
              onPress={() => this.setState({ married: !this.state.single})}/>

или если установлен один, то

state: {
  single: true,
}


<CheckBox title="Single"
              checked={this.state.single}
              onPress={() => this.setState({ single: !this.state.single})}/>

 <CheckBox title="Married"
              checked={!this.state.single}
              onPress={() => this.setState({ married: !this.state.single})}/>

Надеюсьэто работает для вас.:)

Answer 2

На самом деле существует три условия.

1. Пользователь не выбрал поле
2. Пользователь выбирает одиночный
3. Пользователь выбирает женатого.

Если у вас есть проверка, то есть пользователь должен установить флажок, тогда вы можете отменить первое условие.Исходя из этого, можно определить, когда пользователь выбрал ящик, что он выбрал, зная состояние только одного из ящиков.Так что если у вас есть кнопка, которая проверяет валидацию, вы можете сделать что-то вроде этого.

<Button 
  title={'check married status'}
  onPress={() => {
   if (!this.state.single && !this.state.married) {
     alert('Please check a box)
   } else {
     // we only need to check one of them
     let marriedStatus = this.state.married ? 'married' : 'single';
     alert(`You are ${marriedStatus}`)
     // then you can do what you want with the marriedStatus here
   }
  }}
/>

Answer 3

Похоже, они операции XOR.Вам нужно установить текущее состояние каждого, посмотрев прошлое состояние нажатой кнопки.

http://www.howtocreate.co.uk/xor.html

холост:

{single: !this.state.single, married: this.state.single}

женат

{single:this.state.married, married: !this.state.married}