我正在创建一个带有 react-native-elements 的复选框列表。我如何一次只选中一个框？

Question

我正在制作一个复选框列表，但是当我按下一个复选框时，它会选中所有复选框。我想一次select一个。

我尝试了 react-native-elements 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>
    );
  }
}

我想一次 select 一个复选框（select 我按下的复选框而不是 select 一次全部选中）。

Answer 1

好的，我已经为你创建了一个简单的测试here。

基本上，如果您为每个复选框单独分配一个单独的状态，它就可以工作。

  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>
    );
  }

我正在创建一个带有 react-native-elements 的复选框列表。我如何一次只选中一个框？

I am creating a checkbox list with react-native-elements. How do I check only one box at a time?

javascript

checkbox

ios

react-native

react-native-elements