Redux проверить массив, если объект соответствует объекту обновления

Question

const initialState = {
    cart: []
}


export default function(state = initialState, action){
    
    switch(action.type){
        case 'CART_ADDITEM':
        return { 
            ...state,
            cart: [...state.cart, action.payload]
        }

        case 'CART_REMOVEITEM':
        return {
            ...state,
            cart: state.cart.filter(item => item !== action.payload)
        }
        break;
        }
    return state;
}

вот мои функции добавления / удаления в массив

это объект в массиве.

id(pin): "001"
Name(pin): "Dab on them"
price(pin): 100
img(pin): "/static/media/001.ac043cfc.png"
rarity(pin): "rare"
size(pin): "S"
quantity(pin): 1

как проверить, когдадобавление нового элемента в массив, если объект соответствует, и если он обновляет количество + 1.

То же самое относится и к удалению элемента из массива, если количество> 1, то количество -1

Answer 1

Вы можете проверить, присутствует ли уже в массиве объект с таким же идентификатором и в каком количестве.В этом случае обновите количество, в противном случае добавьте объект в массив.

Я бы написал несколько вспомогательных методов, чтобы все было ясно и отдельно.

Вы можете проверить наличие по количеству с помощью чего-то вродеthis:

const quantityForItem = (list, newItem) => {
  const item = list.find(item => item.id === newItem.id)
  return item && item.quantity || 0
}

Вы можете увеличивать или уменьшать количество предметов, переназначая список и изменяя интересующий предмет:

const updateQuantity = (list, newItem, variation) =>
  list.map(item => {
    if ( item.id !== newItem.id ) return item
    return { ...item, quantity: item.quantity + variation }
  })

Вы можете добавить новый предмет, просто констатируя его впредыдущий списокОбратите внимание: concat, а не push, потому что нам нужно сохранить его неизменным.

const add = (list, newItem) =>
  list.concat(newItem)

Удаление объекта может быть таким же, как у вас:

const remove = (list, itemToRemove) =>
  list.filter(item => item.id !== itemToRemove.id)

Собираем все вместе:

case 'CART_ADDITEM': {
  const { cart } = state
  const newItem = action.payload
  if ( quantityForItem(cart, newItem) !== 0 ) {
    return { cart: updateQuantity(cart, newItem, +1) }
  }
  return { cart: add(cart, newItem) }
}

case 'CART_REMOVEITEM': {
  const { cart } = state
  const itemToRemove = action.payload
  if ( quantityForItem(cart, itemToRemove) > 1 ) {
    return { cart: updateQuantity(cart, itemToRemove, -1) }
  }
  return { cart: remove(cart, itemToRemove) }
}