使用复选框从数组中添加和删除对象

Question

我已经在 React Native 的屏幕上实现了复选框，我想要实现的是，在选择复选框时，它将将该对象添加到数组中，并在取消选中时将其从数组中删除。

我曾尝试使用过滤器方法和循环，但它不能按照要求的方式工作。

for (let i = 0; i<tmp.length; i++){

    console.log("length",tmp.length)

    if(tmp.id == item.id){

        tmp.splice(tmp.indexOf(item.id),1);

        // tmp.pop(item)

        console.log("POP")

    }

    else {

        tmp.push(item);

            console.log("PUSH")

    }

}

我的对象数组如下：

contacts:[

    {name:'a', id:1, plant:3},

    {name:'b', id:2, plant:1},

    {name:'c', id:3, plant:1}

],

复选框代码：

<CheckBox

    checked={this.state.selectedCheckList.includes(item.id)? true:false}

    onPress={()=>this.onCheckboxPress(item)} color={"#8BC63E"}

/>

我希望我在其中创建的数组tmp是动态的，这样可以从数组中删除和添加整个特定对象。

前：

tmp:[

    {name:'a', id:1, plant:3},

    {name:'b', id:2, plant:1},

    {name:'c', id:3, plant:1}

],

后：

tmp:[

    {name:'a', id:1, plant:3},

    {name:'c', id:3, plant:1}

],

Answer 1

Try this::var arr=[];function change(checkbox){&nbsp; if(checkbox.checked == true)&nbsp; {&nbsp; &nbsp; arr.push(checkbox.value);&nbsp; }&nbsp; else&nbsp; {&nbsp; &nbsp; &nbsp;var j = arr.indexOf(checkbox.value);&nbsp; &nbsp; &nbsp;arr.splice(j, 1);&nbsp; }&nbsp;&nbsp;&nbsp; var stringArr=arr.join(',');&nbsp; document.getElementById('display').innerHTML=stringArr;}<div>&nbsp; <label>&nbsp; &nbsp; <input type="checkbox" name="check" value="Check 1" onchange="change(this)">A</label>&nbsp; <label>&nbsp; &nbsp; <input type="checkbox" name="check" value="Check 2" onchange="change(this)">B</label>&nbsp; <label>&nbsp; &nbsp; <input type="checkbox" name="check" value="Check 3" onchange="change(this)">C</label>&nbsp; <label>&nbsp; &nbsp; <input type="checkbox" name="check" value="Check 4" onchange="change(this)">D</label></div><div id="display"></div>