如何在我的Redux应用程序中正确返回状态

Question

我们有一些待办事项列表。我们的initialState有点像。。。

initialState = [   {
id: 0,
title: "first",
items: [
{
title: "one from first",
id: 0,
cards: [
{
id: 0,
text: "111",
},
{
id: 1,
text: "222",
},
],
},
{
title: "two from first",
id: 1,
cards: [
{
id: 0,
text: "www",
},
{
id: 1,
text: "zzz",
},
],
},
],   },   {
id: 1,
title: "second board",
items: [
{
title: "first from second",
id: 0,
cards: [
{
id: 0,
text: "asd",
},
{
id: 1,
text: "fasdf",
},
],
},
],   }, ];

出于某些原因，我们不会使这种状态正常化。我必须添加新的列表。这里的减速器：

switch(action) {
case CONSTANTS.ADD_LIST:
const newList = {
title: action.payload.title,
cards: [],
id: listID,
};
listID += 1;
return {
...state,
[action.payload.boardID]: {
...state[action.payload.boardID],
items: [...state[action.payload.boardID].items, newList],
},
};
}

示例。我想为板1中的项目添加newList(从0开始(。

我测试了另外一个类似上面的例子，但它没有用。

所以我不明白为什么它不起作用。我想我有一些文件redux的问题，我不能得到它。

谢谢！

Answer 1

您的initialState似乎是一个数组而不是对象：

initialState = [ {Board1},{Board2} ]

但是您的reducer似乎返回了一个对象，所以这可能是一个潜在的问题

======

您可以在减速器中尝试以下更改：

• 制作板的浅拷贝Arr aka initialState
• 在每个板上循环并创建一个新的板对象
• 在每个板对象的items道具上循环，并创建其浅层副本
• 循环每个项目的cards道具并创建其副本
• 最后更换你想要的董事会物品，然后
• 返回新创建的板rr

// Pseudo code inside reducer
const newBoardsArr = state.map(board => {
return {
...board,
items: board.items.map(item => ({
...item,
cards: item.cards.map(card => ({
...card
}))
}))
}
});
// lets say we want to update first board's items, then:
newBoardsArr[action.payload.boardID].items = newList;
return newBoardsArr;