javascript - 如何在嵌套的 javascript 对象上使用扩展运算符?
问题描述
我正在尝试更新我的部分 redux 状态,其中包含嵌套在另一个对象中的两个对象。通常在不可变地更新 javascript 对象时,我会使用扩展运算符,然后定义任何更改,如下所示:
state = {...state, property1: newvalue}
但是,当我有嵌套对象时,我不确定如何使用扩展运算符。这是相关代码和我的尝试:
const squadDatabase = {currentSquad: {
0: null,
1: null,
2:null
}, newAdditions: null}
export default (state=initial_squad, action)=>{
switch(action.type){
case ADD_PLAYER_TO_SQUAD:
return {...state, currentSquad[action.payload.currentSquadMemberId]:action.payload.newSquadAdditionId, newAdditions: action.payload.newSquadAdditionId}
default:
return initial_squad
}
}
有谁知道如何使用扩展运算符或其他方式不可变地更新嵌套的 javascript 对象?
解决方案
基本上你必须添加第二级对象(状态)解构。
return {
...state, // first nesting level spread
currentSquad: {
...this.state.currentSquad, // second nesting level spread
currentSquad[action.payload.currentSquadMemberId]: action.payload.newSquadAdditionId,
},
newAdditions: action.payload.newSquadAdditionId,
};
推荐阅读
- reactjs - Draggables 在拖动时组合在一起
- python - Odoo:cron作业集nextcall,一天中的特定时间不工作
- javascript - 错误是什么?我应该在这里使用异步等待吗?
- angular - 如何取消订阅自己编写的 Observable?
- php - SMS发送并发现一些错误。如何解决这个问题
- postgresql - Postgres 锁定的行数是否超过提供的限制?
- python - 在 sympy 中使用求解函数时 python 中的内存错误
- c++ - 围绕 C++ 代码的 C 包装器的模拟框架
- excel - 如何在不重新输入公式的情况下在excel中自动更改文本编号?
- acumatica - 如何在新的维护屏幕中应用 PXForeignReference