Arrays 将复选框的值追加并删除到Reactjs中的数组状态中

我正在使用mui复选框组件，以下是我显示它的方式：

 <FormControl component="fieldset">
    <FormGroup aria-label="position" column>
        {sortedData.map((obj) => {
            return (
                <FormControlLabel
                    value="type"
                    control={<Checkbox color="primary"/>}
                    label={obj}
                    name={obj}
                    onChange={handleTypeCheckboxChange}
                    labelPlacement="end"
                />
            );
        })}
    </FormGroup>
</FormControl>

---

如何解决此问题？

从

push

和

indexOf

方法参数中删除+号。
因为：

+'anystring'=NaN

（代表问题作者发布解决方案，将答案移动到答案空间）

这个问题解决了。我将代码更改为：

 const handleTypeCheckboxChange = (event, index) => {


        if (event.target.checked) {
            setTypeCheckboxCount(prevState => prevState + 1)
            
            setTypeValue([...typeValue, event.target.name])
        } else {
            setTypeCheckboxCount(prevState => prevState - 1)
            
            setTypeValue(
                typeValue.filter( v => v !== event.target.name)
            )


        }

        
    }

---

好的，我删除了itt，但它没有添加值或正确删除值。数组中始终只有一个值，当我取消选中任何框时，数组大小变为0。即使选中了其他一些框。

setTypeValue（[…typeValue，event.target.name]）

是反模式的。您不应该将状态用于自己的更新。相反，应该使用`setTypeValue（prevTypes=>[…prevTypes，event.target.name]），您应该在codesandbox上复制它，以便其他人更容易跟上

 const handleTypeCheckboxChange = (event, index) => {


        if (event.target.checked) {
            setTypeCheckboxCount(prevState => prevState + 1)
            
            setTypeValue([...typeValue, event.target.name])
        } else {
            setTypeCheckboxCount(prevState => prevState - 1)
            
            setTypeValue(
                typeValue.filter( v => v !== event.target.name)
            )


        }

        
    }