Как отправить в state новое значения quantity?

Question

[DeniSidorenko]

Добрый день есть такой код

const initialState = {
  asideItems: [],
  total: 0
}

const asideReducer = (state = initialState, action) =>{
  switch(action.type) {
    case ADD_TO_ASIDE:
      const item = action.payload
      const existItem =  state.asideItems.find(item => action.payload.id === item.id)
      if(existItem)
      {
        console.log(item)
        item.quantity += 1
        console.log(item)

        return{
          ...state,
          total: state.total + item.price,
        }
      }
      else{
        return{
          ...state,
          asideItems: [...state.asideItems , item],
          total: state.total + item.price
        }
      }
    default:
      return state
  }
}

Больше всего хочется затронуть внимания на данном моменте

if(existItem)
      {
        console.log(item) // Quantity = 1
        item.quantity += 1
        console.log(item) // Quantity =  2

        return{
          ...state,
          total: state.total + item.price,
        }
      }

Я сделал простую проверку что если в asideItems уже есть такой, то просто поменять количество. Как можно видить по console.log item.quantity += 1- работает, но не отправляет в state. И за чего каждый значения в самом state не изменяется. Кто может подсказать в чем ошибка

Answer 1

[twolegs]

1. Вы изменяете объект из payload, а не из стейта. Нужно поменять existItem, чтобы что-то изменилось.
2. Редакс предполагает иммутабельность. Так что корректное обновление стейта в данном случае будет выглядеть так:

const item = action.payload
      const existItem =  state.asideItems.find(item => action.payload.id === item.id);
      if(existItem)
      {
        return{
          ...state,
          asideItems: state.asideItems.map(currentItem => item.id === currentItem.id ? { ...currentItem, quantity: currentItem.quantity + 1 } : currentItem),
          total: state.total + item.price,
        }
      }

Comments

[DeniSidorenko]

Спасибо большое за такой детальный ответ)