处理试图设置不可变和冻结对象的键的错误

Question

我有以下处于状态的对象：

App.js

const data = {name: 'John', status:'employeed' };
const [manager, updateManager] = useState(data);
const updateStatus = async () =>{
await service.setStatus(manager);

}

setStatus确实直接修改了管理器，我认为这是问题的根源

services.js

setStatus(manager){
manager.status = 'employeed';
}

所以我修改了调用以发送管理器对象的副本并返回一个新对象，但我仍然得到错误

you tried to modify 'status' key of an immutable object.

这是我的新零钱

App.js

const updateStatus = async () =>{
const g = await service.setStatus({...manager});
updateManager(g);
}

services.js

setStatus(manager){
manager.status = 'employeed';
return manager;
}

Answer 1

为什么这个函数是异步的？

const updateStatus = async () =>{
await service.setStatus(manager);
}

这将返回一个新的/更新的对象，但不会进行任何永久更改。

setStatus(manager){
return {…manager,status: 'employeed'};
}

上次更改后的问题是否仍然存在？

您应该传递这样的回调：

const updateStatus = (manager) => {
service.setStatus(()=> updateManager({
...manager,
status: 'employeed'
}));

服务.js

setStatus(updateManager){
updateManager(manager);
}