改变状态而不改变旧状态

Question

我具有此默认状态：

const [manager, setManager] = useState([{ name: undefined, project: [] }]);

我的数据来自如下所示的API：

[{name : 'John doe'} , {'jane' : doe}]

如何更新状态，以便在将数据添加到状态后最终看起来像这样：

[{ name: 'john doe', project: [] } , { name: 'jane doe', project: [] }]; 

我尝试过：

setManager(prev => ([...prev , res.data]));

Answer 1

我假设您是要更改此内容：

[{name : 'John doe'}, {name : 'Jane doe'}]

类似这样

[{ name: 'john doe', project: [] } , { name: 'jane doe', project: [] }];

在此代码片段中，您将现有数据与新数据一起传播。

 setManager(prev => ([...prev, res.data]));

因此在manager中，您将得到2个数组，因为您没有散布第二个数组

[{ name: undefined, project: [] }, [{name : 'John doe'} , {name : 'Jane doe'}]]

在这种情况下，还要假设您的project键可能不是空的，并且您想map在每个api数据中都包含数据的现有项目。

我会做这样的事情

setManager(prevData => 
  resData.map(singleRes => {
    return {name: singleRes.name, project: prevData.project}
  })
)