React JS 切换所选项目

Question

我正在使用反应钩子，我的组件中的状态。选项列表可供用户选择。我需要跟踪选择了哪些选项 - 请参阅状态中的“selectedArr”。

虽然这部分有效，但过滤 selectedArr 是错误的，如果我先选择选项中的第二项，则不会过滤？我不明白为什么。

如何跟踪选择了哪些选项并切换单个选项？

这是我的代码

const BarGraph = ({graphData, daysRange}) => {
const [optionsIndex, setOptionsIndex] = useState(0);
const [selectedArr, setSelectedArr] = useState([]);


const toggleActiveItem = (index) => {
    //Update the option index 
    setOptionsIndex(index);

    //Update selected options array
    setSelectedArr([...selectedArr, index]) 

    if(index === selectedArr[index]) {
        //Prevent from adding multiple of the same index
        setSelectedArr([...selectedArr])

        //if index is equal to the selected array index 
        //removed the matched index from selected array
        setSelectedArr(selectedArr.filter((i) => i !== index)); 
    }

}

Answer 1

const toggleActiveItem = (index) => {
    
    if(selectedArr.includes(index)){
      setSelectedArr(selectedArr.filter((i) => i !== index)) 
    } else {
     setSelectedArr([...selectedArr, index]) 
    }

    setOptionsIndex(index)
}