Question

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

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

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

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的复选框列表。如何一次只勾选一个框？

1 个答案: