我的 React 应用程序中使用 hooks 和 es6 有 CRUD 功能。 我也在使用 AntDesign 列表组件。在我的添加函数中,第一次添加后,预计它已添加到列表中。
但是在创建另一个数组之后,它只是替换现有的数组。它没有像索引 1 那样添加。它始终是索引 0。
这是我的代码
const leaveTypeList = [];
const [isLeaveType, setLeaveType] = useState(leaveTypeList);
useEffect(() => {
setLeaveType(leaveTypeList);
}, [setLeaveType]);
const payload = {
leaveTag: values.leaveTag,
leaveTagColor: values.leaveTagColor,
hexCode: state.tagColor,
dateCreated: formatLeaveTypeDate,
};
leaveTypeList.push(payload);
setLeaveType(leaveTypeList);
最佳答案
嘿,因为您需要向数组添加新项目,所以不需要 useEffect Hook
const leaveTypeList = [];
const [isLeaveType, setLeaveType] = useState(leaveTypeList);
const payload = {
leaveTag: values.leaveTag,
leaveTagColor: values.leaveTagColor,
hexCode: state.tagColor,
dateCreated: formatLeaveTypeDate,
};
setLeaveType([...isLeaveType,payload]);
您可以简单地使用 setter 设置新状态,通过向现有数组添加新的有效负载来更新现有数组。
关于javascript - 在现有数组中添加数组中的新对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58572593/