Array.push 仅推送数组中的最后一个对象

Array.push is pushing only last object in the array

首先我将id设置为一个对象

attribute.map((item, index) => {
                    setIds({ ...ids, [index]: item.id })
                })

然后我尝试将它推入数组，但它只推最后一个对象

let idsArr = []
Object.keys(ids).map(key => {
            idsArr.push(ids[key])
        })

一个建议可以是将地图结果推送到数组中

idsArr.push(...Object.keys(ids).map(key => ids[key]));

此外，如果您不设置 id return，则不应使用 map 方法。

像foreach这样的循环是更好的选择

map 方法用于获取“转换后”的数组

  attribute.forEach((item, index) => {
       setIds({ ...ids, [index]: item.id })
  })


let idsArr = [];

let ids = {
  'test': 1,
  'test2': 2
};
idsArr.push(...Object.keys(ids).map(key => ids[key]));

console.log(idsArr);

问题

您正在使用普通更新在循环内排队一堆 React 状态更新，并且当每个更新都由 React 处理时，它使用 相同的 来自渲染周期的 ids 值，它们都被排入队列。换句话说，每次更新都会踩踏前一次，最后一次状态更新获胜。这是您在后续渲染周期中看到的状态值。

解决方案

使用功能状态更新对每个更新进行排队，并让每个更新都来自前一个状态，而不是来自回调闭包的状态。

示例：

attribute.forEach((item, index) => {
  setIds(ids => ({
    ...ids,
    [index]: item.id,
  }))
});

使用正确更新的 ids 数组状态，您应该能够迭代并将值推入另一个数组：

const idsArr = [];
Object.keys(ids).map(key => {
  idsArr.push(ids[key]);
});

或者直接获取值数组：

const idsArr = Object.values(ids);