Я создаю список флажков с реагировать родные элементы. Как установить только один флажок за раз? - PullRequest
2 голосов
/ 18 апреля 2019

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

Я пробовал пример кода из документации реагирующих элементов 1.1.0, а также примеры от других людей, но не могу найти решение.

constructor() {
    super();

    this.state = {
      checked1: false,
      checked2: false,
    };
  }

render() {
    return (
      <View style={styles.container}>
        <ScrollView>
          <CheckBox
            checkedIcon='dot-circle-o'
            uncheckedIcon='circle-o'
            title='checkbox 1'
            checkedColor='red'
            checked1={this.state.checked1}
            onPress={() => this.setState({ checked1: !this.state.checked1 })}
          />
          <CheckBox
            checkedIcon='dot-circle-o'
            uncheckedIcon='circle-o'
            title='checkbox 2'
            checkedColor='red'
            checked2={this.state.checked2}
            onPress={() => this.setState({ checked2: !this.state.checked2 })}
          />
        </ScrollView>
      </View>
    );
  }
}

Я хочу установить один флажок за раз (установите флажок, на котором я нажал, вместо того, чтобы выбирать все сразу).

1 Ответ

1 голос
/ 18 апреля 2019

хорошо, я создал простой тест здесь для вас.

в принципе, если вы назначите отдельное состояние для каждого флажка отдельно, это будет работать.

  constructor() {
      super();

      this.state = {
        checked1: false,
        checked2: false,
      };
    }

  render() {
    return (
      <View style={styles.container}>
        <ScrollView>
          <CheckBox
            checkedIcon='dot-circle-o'
            uncheckedIcon='circle-o'
            title='checkbox 1'
            checkedColor='red'
            checked={this.state.checked1}
            onPress={() => this.setState({ checked1: !this.state.checked1 })}
          />
          <CheckBox
            checkedIcon='dot-circle-o'
            uncheckedIcon='circle-o'
            title='checkbox 2'
            checkedColor='red'
            checked={this.state.checked2}
            onPress={() => this.setState({ checked2: !this.state.checked2 })}
          />
        </ScrollView>
      </View>
    );
  }
...