Question

如果我有一个状态对象：

[{
   "value":"e1",
   "label":"john@example.com",
   "domain":"d1",
   "selected":false
},
{
   "value":"e2",
   "label":"jack@example.com",
   "domain":"d1",
   "selected":false
},
{
   "value":"e3",
   "label":"silvia@example.com",
   "domain":"d1",
   "selected":false
}]

和动作对象

{
    "value":"e1",
    "label":"john@example.com",
    "domain":"d1",
    "selected":false
}

在redux reducer中，如何更改操作对象＆＃39; selected＆＃39;变为true并分别更新状态而不使用优选的纯ES6函数进行变异？

我对Redux世界很陌生，并且发现在不改变状态的情况下更新状态很困难。

Answer 1

实际上，我很早以前就对此进行了整理，但认为对其他人可能有用：

export const select = (state, action) => {

    const index = state.findIndex(elem => elem.value === action.payload.value);

    return [
        ...state.slice(0, index),
        {
            ...action.payload,
            selected: true
        },
        ...state.slice(index + 1)
    ];
};

Answer 2

我假设当前state中存在大量内容，并且您希望在数组中将第一个对象的selected值更改为true然后将其与当前状态合并并更新状态。

让我们说你的状态对象＆＃39;被称为foo，在你的reducer函数中，你将首先执行类似foo[0].selected = true;的操作，然后你可以使用扩展运算符更新状态，如：

return {
  ...state,
  foo
};

我希望这有点意义，或者我可能会因你提出的问题而离开？

更新一个没有变异的对象数组的状态

2 个答案: