Как изменять вложенные свойства в redux?

Question

[PlasterTom]

Необходимо изменить полу qty у одного из элементов массива, этот элемент передается в payload экшена.

// массив объектов 
items = [
   {
        id: '1',
        desc: 'Some description',
        qty: 1
    },
  {
        id: '2',
        desc: 'Another description',
        qty: 1,
    },
// и т.д.

// action
export const incrementQty = (item) => {
    return {
        type: INCREMENT_QTY,
        payload: item
    }
};

// reducer с ошибкой
const initialState = {
    items: items
};

export default function(state = initialState, action) {
    const {type, payload} = action;

    switch (type) {
        case INCREMENT_QTY:
          const newItem =   state.items.filter(item => item === payload);
          return {
              ...state,
              newItem: {
                  ...newItem,
                  [newItem.qty]: 10
                  }
              };
        default:
            return state
    }
}

Я знаю, что при изменении вложенных данных необходимо делать копии на всех уровнях вложенности.
Разбирал пример из документации:

function updateVeryNestedField(state, action) {
    return {
        ...state,
        first : {
            ...state.first,
            second : {
                ...state.first.second,
                [action.someId] : {
                    ...state.first.second[action.someId],
                    fourth : action.someValue
                }
            }
        }
    }
}

И мой код выше - попытка повторить правильных подход, описанный в документации. Но у меня не получается, я что-то делаю не так, чего-то явно не понимаю в этом процессе. Может ли кто-то объяснить, в чем моя ошибка? Я ожидаю на выходе, что изменится значение поля qty, но получаю в state следующее:

items: [тут массив объектов items без каких либо изменений]
newItem.undefined: 10 - новое поле в состоянии

Также в курсе про immutable.js и immutability-helper и в будущем планирую пользоваться этими решениями. Но в этом примере хотелось бы разобраться без них и понять, что происходит в коде.

Comments

[PlasterTom]

Решение:

const {type, payload: newItem } = action;

    switch (type) {
        case INCREMENT_QTY:
            return {
                ...state,
                items: state.items.map(item => {
                    if(item !== newItem) {
                        return item;
                    }
                    return {
                        ...item,
                        qty: //change qty
                    }
                })
            };

Answer 1

[davidnum95]

case INCREMENT_QTY:
    const { payload: newItem } = action;
    return {
      ...state,
      items: state.items.map(item => {
        if(item.id === newItem.id) {
          return {
            ...item,
            qty: newItem.qty,
          }
        }
        return item;
      })
    };

Comments

[PlasterTom]

Этот код совсем не меняет состояние

[davidnum95]

PlasterTom, может прежде чем что то утверждать, вы это проверите?

[PlasterTom]

davidnum95, а вы проверили, свое заявление о том, что я не проверял ваш код, прежде чем что-то утверждать по этому поводу?

[PlasterTom]

davidnum95, тем не менее ваш код оказался полезен, немного подредактировав, я получил результат, так что спасибо.

[batonpeton]

PlasterTom, Привет, а что ты подредактировал сижу туплю с таской уже неделю?