在数组Reactjs中捕获值时缺少对象

Question

const [keyNo, setKeyNo] = useState(0);

const { useAppDispatch } = useReduxApp();
const dispatch = useAppDispatch();
const [tabs, setTabs] = useState<TabItem[]>(initialTabs);
const newCase = {
key: String(keyNo),
title: (
<div style={{ color: 'red' }}>
New Case {keyNo}
<div className={s.btnCloseTab} onClick={() => delCase(keyNo)}>
<i className="bi bi-x-circle-fill"></i>
</div>
</div>
),
children: <CreateForm keyNo={keyNo} />,
};
const addCase = () => {
setKeyNo((prev) => prev + 1);
const newTabs = [...tabs, newCase];
setTabs(newTabs);
};
const delCase = (id) => {
console.log(id);
console.log(tabs);
};

在此处输入图像描述

当我点击X按钮时，我只有6个对象，缺少带有"的对象；键5"；(新案例5(，我不知道怎么了，请帮我

Answer 1

尝试使用更新程序功能

const addCase = () => {
setKeyNo((prev) => prev + 1);
setTabs(currentTabs => currentTabs.concat(new case));   };

Answer 2

如您在console.log中所见。您有6个带键的对象："myWork"0"1〃"2〃"3〃"4〃；。因此，实际上不存在具有关键字"的项目；5〃；，你错过了它，或者你的逻辑有问题，这取决于你想做什么。例如，mby你正在获取索引[1,2,3,4,5]，而不是[0,1,2,3,4]