如何使用listview选择mulitple项目使用复选框本地?

时间:2017-09-13 00:51:10

标签: checkbox react-native react-native-listview

我正在使用复选框处理listview。我试图选择多个项目,但我在结果中发现了一些内容,每次单击复选框时,结果都会替换我检查的第一个项目

这是我的理由:

    this.state = {
     ...
     checkedBoxCheck: false,
     selectedItems:[],
   };

    renderRow(rowData) {
        return (
            ...
           <CheckBox style={styles.checkboxed}
              checked={rowData.id === this.state.checkedBoxCheck}
              onPress={() => this.onItemSelect(rowData)}
            />
        );

onItemSelect(row){
    this.setState({
        selectedItems: [{row}],
        checkedBoxCheck: true,
    });
    let myitem = this.state.selectedItems.concat({row});
    console.log(myitem);
}

2 个答案:

答案 0 :(得分:2)

你忘了在以前的值中写入selectedItems:

this.setState((prevState) => ({
    selectedItems: [...prevState.selectedItems, row],
    checkedBoxCheck: true,
}));

删除值(使用lodash):

this.setState((prevState) => ({
    selectedItems: _.without(prevState.selectedItems, row),
    checkedBoxCheck: !!_.without(prevState.selectedItems, row).length,
}));

答案 1 :(得分:0)

尝试使用表单生成器的选择字段。 https://github.com/bietkul/react-native-form-builder