Redux: обновить элемент в массиве объектов

Question

В моем редукторе под названием 'reducer_product_list' у меня есть этот массив:

let initialState = [
    {name: 'Article 1', price: 5, quantity: 10},
    {name: 'Article 2', price: 15, quantity: 8},
    {name: 'Article 3', price: 7, quantity: 15},
    {name: 'Article 4', price: 9, quantity: 5},
    {name: 'Article 5', price: 11, quantity: 100},
    {name: 'Article 6', price: 23, quantity: 20},
  ]

Когда я получаю действие 'ADD_TO_CART', я хочу уменьшить количество выбранного объекта.Полезная нагрузка является одним из этих объектов.

Я набрал код выше:

export default (state = initialState, action) => {
  switch (action.type) {
    case 'ADD_TO_CART':
      initialState.map((product, i) => {
        if (product.name === action.payload.name) {
          initialState[i].quantity -= 1
          return state;
        }
      });
    default: return state
  }
}

Если я console.log моего initialState, количество уменьшается, но в моем контейнере, который отображает представлениеколичество не меняется.

Спасибо за помощь.

Answer 1

Спасибо за помощь, все работает хорошо!Мне просто нужно было изменить одну вещь: вместо сопоставления в initialState я сопоставил состояние.

export default (state = initialState, action) => {
  switch (action.type) {
    case 'ADD_TO_CART':
      return state.map(product => {
        if (product.name === action.payload.name) {
          return {...product, quantity: product.quantity - 1}
        };
        console.log(state)
        return product;
      });
    default: return state
  }
}

Answer 2

Попробуйте это:

export default (state = initialState, action) => {
  switch (action.type) {
    case 'ADD_TO_CART':
      return state.map(product => {
        if (product.name === action.payload.name) {
          return {...product, quantity: product.quantity-1}
        };
        return product;
      });
    default: return state
  }
}

Причина в том, что вы должны вернуть новый объект состояния, полученный из текущего состояния, отражающий требуемые изменения в соответствии с запрошенным действием.Подробнее см. Редукторы Redux .