Как мутировать массив по состоянию в редукторном редукторе? - PullRequest
Новая
       33

Как мутировать массив по состоянию в редукторном редукторе?

0 голосов
/ 29 августа 2018

Состояние до изменения выглядит следующим образом: 

foreignBases: [
  {
    base: {
      id: "5b8125ec14bb4f35f8f01aa9",
      ...
    },
    baseuser: {
      userId: "tester1",
      ...
    }
  },
  { base: { ... }, baseuser: { ... } }
]

посредством отправки пользователь изменяет логическое значение в ключе baseuser на true, тогда редуктор должен обновлять состояние для этой конкретной пары ключ-значение, но я не могу сделать это правильно с этим: 

for (let i = 0; i < state.foreignBases.length; i++) {
  if (action.baseUser.created === state.foreignBases[i].baseuser.created) {
    return Object.assign({}, state, {
      foreignBases: [
        ...state.foreignBases,
        {
          base: { ...state.foreignBases[i].base },
          baseuser: action.baseUser
        }
      ]
    });
}

Это просто добавляет другой объект в состояние, когда мне действительно нужно заменить один логический элемент baseuser в одном объекте

1 Ответ

0 голосов
/ 29 августа 2018

Обязательно проверьте наличие обновлений ниже.

Оператор распространения повторно вставляет все инородные базы, а затем вы добавляете еще один объект с предполагаемой мутацией.

Я думаю, что вы имеете в виду что-то вроде этого (не проверено) 

for (let i = 0; i < state.foreignBases.length; i++) {
  if (action.baseUser.created === state.foreignBases[i].baseuser.created) {
    let foreignBases = [...state.foreignBases];
    foreignBases[i].baseuser = action.baseUser;
    return Object.assign({}, state, {foreignBases});
  }
}

Обновление : @devserkan напомнил мне, что оператор распространения "не делает глубокого копирования", что в Redux запрещено! Поэтому я искал обновление элемента в официальном шаблоне массива , которое, как мне кажется, применяется следующим образом (опять же, не проверено): 

let foreignBases = state.foreignBases.map((foreignBase) => {
  if (action.baseUser.created === foreignBase.baseuser.created) {
    return {action.baseUser};
  } else {
    return foreignBase
  }
});
return Object.assign({}, state,  { 
   ...foreignBase,
   baseuser: action.baseUser
});

Обновление 2 : @devserkan в комментариях снова вносит ценный вклад, на этот раз исправляя исходный цикл for, вкладывая его в части объекта состояния. Что похоже на мутацию. Этот подход позволяет избежать этого и позволяет использовать цикл for. 

for (let i = 0; i < state.foreignBases.length; i++) {
  if (action.baseUser.created === state.foreignBases[i].baseuser.created) {
    const newItem = {
      ...state.foreignBases[i],
      baseuser: action.baseUser
    };
    const newforeignBases = Object.assign([], state.foreignBases, {
      [i]: newItem
    });
    return Object.assign({}, state, { foreignBases: newforeignBases });
  }
}
...