我不知道如何使用Redux reducer更新对象内部的数组。 我已经搜索了很长时间，看了一下Redux文档，我写的代码看起来像在那儿看到的那样，但是由于某种原因它不能正常工作。
更新前的状态如下：
{
groups: {
groups: [
{
_id: '5f7f5a3097d3b6a8e49086a5',
name: 'asd3',
avatar_color: '#ffffff',
avatar_bgcolor: '#000000'
},
{
_id: '5f7f5a4397d3b6a8e49086a6',
name: 'asd fgh',
avatar_color: '#000000',
avatar_bgcolor: '#ffffff'
}
],
currentGroup: {
_id: '5f7f5a3097d3b6a8e49086a5',
messageCount: 10,
messages: [
{
_id: '5f7f99b262657b148406cad5',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 0',
createdAt: '2020-10-08T22:58:58.181Z',
updatedAt: '2020-10-08T22:58:58.181Z'
},
{
_id: '5f7f99b462657b148406cad6',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 1',
createdAt: '2020-10-08T22:59:00.902Z',
updatedAt: '2020-10-08T22:59:00.902Z'
},
{
_id: '5f7f99b662657b148406cad7',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 2',
createdAt: '2020-10-08T22:59:02.731Z',
updatedAt: '2020-10-08T22:59:02.731Z'
},
{
_id: '5f7f99b862657b148406cad8',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 3',
createdAt: '2020-10-08T22:59:04.360Z',
updatedAt: '2020-10-08T22:59:04.360Z'
},
{
_id: '5f7f99ba62657b148406cad9',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 4',
createdAt: '2020-10-08T22:59:06.052Z',
updatedAt: '2020-10-08T22:59:06.052Z'
},
{
_id: '5f7f99bb62657b148406cada',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 5',
createdAt: '2020-10-08T22:59:07.870Z',
updatedAt: '2020-10-08T22:59:07.870Z'
},
{
_id: '5f7fa6090c7e871c1f1d400d',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 6',
createdAt: '2020-10-08T23:51:37.772Z',
updatedAt: '2020-10-08T23:51:37.772Z'
},
{
_id: '5f7fabf00c7e871c1f1d400f',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 7',
createdAt: '2020-10-09T00:16:48.795Z',
updatedAt: '2020-10-09T00:16:48.795Z'
},
{
_id: '5f7faee20c7e871c1f1d4010',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 8',
createdAt: '2020-10-09T00:29:22.360Z',
updatedAt: '2020-10-09T00:29:22.360Z'
},
{
_id: '5f7faf8f0c7e871c1f1d4011',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 9',
createdAt: '2020-10-09T00:32:15.747Z',
updatedAt: '2020-10-09T00:32:15.747Z'
}
]
}
}
}
我正在尝试将一条消息添加到currentGroup对象内的messages数组中。
我为减速器尝试了以下代码：
case ADD_CHAT_MESSAGE:
return {
...state,
currentGroup: {
...state.currentGroup,
messages: [...state.currentGroup.messages, action.payload]
}
};
运行此命令时，currentGroup的内容将散布在message对象内（以及旧的message数组），然后将新消息添加到该内部对象的messages数组中，如下所示：
{
groups: {
groups: [
{
_id: '5f7f5a3097d3b6a8e49086a5',
name: 'asd3',
avatar_color: '#ffffff',
avatar_bgcolor: '#000000'
},
{
_id: '5f7f5a4397d3b6a8e49086a6',
name: 'asd fgh',
avatar_color: '#000000',
avatar_bgcolor: '#ffffff'
}
],
currentGroup: {
_id: '5f7f5a3097d3b6a8e49086a5',
messageCount: 10,
messages: [
{
_id: '5f7f99b262657b148406cad5',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 0',
createdAt: '2020-10-08T22:58:58.181Z',
updatedAt: '2020-10-08T22:58:58.181Z'
},
{
_id: '5f7f99b462657b148406cad6',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 1',
createdAt: '2020-10-08T22:59:00.902Z',
updatedAt: '2020-10-08T22:59:00.902Z'
},
{
_id: '5f7f99b662657b148406cad7',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 2',
createdAt: '2020-10-08T22:59:02.731Z',
updatedAt: '2020-10-08T22:59:02.731Z'
},
{
_id: '5f7f99b862657b148406cad8',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 3',
createdAt: '2020-10-08T22:59:04.360Z',
updatedAt: '2020-10-08T22:59:04.360Z'
},
{
_id: '5f7f99ba62657b148406cad9',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 4',
createdAt: '2020-10-08T22:59:06.052Z',
updatedAt: '2020-10-08T22:59:06.052Z'
},
{
_id: '5f7f99bb62657b148406cada',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 5',
createdAt: '2020-10-08T22:59:07.870Z',
updatedAt: '2020-10-08T22:59:07.870Z'
},
{
_id: '5f7fa6090c7e871c1f1d400d',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 6',
createdAt: '2020-10-08T23:51:37.772Z',
updatedAt: '2020-10-08T23:51:37.772Z'
},
{
_id: '5f7fabf00c7e871c1f1d400f',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 7',
createdAt: '2020-10-09T00:16:48.795Z',
updatedAt: '2020-10-09T00:16:48.795Z'
},
{
_id: '5f7faee20c7e871c1f1d4010',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 8',
createdAt: '2020-10-09T00:29:22.360Z',
updatedAt: '2020-10-09T00:29:22.360Z'
},
{
_id: '5f7faf8f0c7e871c1f1d4011',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 9',
createdAt: '2020-10-09T00:32:15.747Z',
updatedAt: '2020-10-09T00:32:15.747Z'
},
{
members: [
'5f699fffc51562181fe52879'
],
_id: '5f7f5a3097d3b6a8e49086a5',
name: 'asd3',
avatar_color: '#ffffff',
avatar_bgcolor: '#000000',
messages: [
{
_id: '5f7f99b262657b148406cad5',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 0',
createdAt: '2020-10-08T22:58:58.181Z',
updatedAt: '2020-10-08T22:58:58.181Z'
},
{
_id: '5f7f99b462657b148406cad6',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 1',
createdAt: '2020-10-08T22:59:00.902Z',
updatedAt: '2020-10-08T22:59:00.902Z'
},
{
_id: '5f7f99b662657b148406cad7',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 2',
createdAt: '2020-10-08T22:59:02.731Z',
updatedAt: '2020-10-08T22:59:02.731Z'
},
{
_id: '5f7f99b862657b148406cad8',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 3',
createdAt: '2020-10-08T22:59:04.360Z',
updatedAt: '2020-10-08T22:59:04.360Z'
},
{
_id: '5f7f99ba62657b148406cad9',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 4',
createdAt: '2020-10-08T22:59:06.052Z',
updatedAt: '2020-10-08T22:59:06.052Z'
},
{
_id: '5f7f99bb62657b148406cada',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 5',
createdAt: '2020-10-08T22:59:07.870Z',
updatedAt: '2020-10-08T22:59:07.870Z'
},
{
_id: '5f7fa6090c7e871c1f1d400d',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 6',
createdAt: '2020-10-08T23:51:37.772Z',
updatedAt: '2020-10-08T23:51:37.772Z'
},
{
_id: '5f7fabf00c7e871c1f1d400f',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 7',
createdAt: '2020-10-09T00:16:48.795Z',
updatedAt: '2020-10-09T00:16:48.795Z'
},
{
_id: '5f7faee20c7e871c1f1d4010',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 8',
createdAt: '2020-10-09T00:29:22.360Z',
updatedAt: '2020-10-09T00:29:22.360Z'
},
{
_id: '5f7faf8f0c7e871c1f1d4011',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 9',
createdAt: '2020-10-09T00:32:15.747Z',
updatedAt: '2020-10-09T00:32:15.747Z'
},
{
_id: '5f7fb03a0c7e871c1f1d4012',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 10',
createdAt: '2020-10-09T00:35:06.025Z',
updatedAt: '2020-10-09T00:35:06.025Z'
},
{
_id: '5f7fb15c0c7e871c1f1d4014',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 10',
createdAt: '2020-10-09T00:39:56.477Z',
updatedAt: '2020-10-09T00:39:56.477Z'
},
{
_id: '5f7fb76e0c7e871c1f1d401c',
sender: '5f699fffc51562181fe52879',
type: 'text',
message: 'test message 10',
createdAt: '2020-10-09T01:05:50.511Z',
updatedAt: '2020-10-09T01:05:50.511Z'
}
],
createdAt: '2020-10-08T18:28:00.475Z',
updatedAt: '2020-10-09T01:05:50.511Z',
__v: 13
}
]
}
}
}
您有如何进行这项工作的提示吗？ 谢谢您的帮助！
答案 0 :(得分：0)
我决定按照评论的建议重构状态结构。感谢大伙们！ 根据获得的参考，我必须对数据进行规范化处理，以便可以轻松处理数据而不必处理嵌套对象。