Как изменить значение свойства объекта, вложенного в массив объектов, который вложен в объект, являющийся элементом массива объектов?

Question

[Kirill1973]

Есть такой массив объектов:

const products = 
[
  {
    id: '1',
    cards: 
    [
      {
        id: '1',
        src: '',
        alt: '',
        price: 0,
        title: '',
        quantity: 1     
      },
      {
        id: '2',
        src: '',
        alt: '',
        price: 0,
        title: '',
        quantity: 1    
      },
      {
        id: '3',
        src: '',
        alt: '',
        price: 0,
        title: '',
        quantity: 1     
      },
      {
        id: '4',
        src: '',
        alt: '',
        price: 0,
        title: '',
        quantity: 1     
      },
    ]
  },
...
  {
    id: '64',
    cards: 
    [
      {
        id: '253',
        src: '',
        alt: '',
        price: 0,
        title: '',
        quantity: 1     
      },
      {
        id: '254',
        src: '',
        alt: '',
        price: 0,
        title: '',
        quantity: 1     
      },
      {
        id: '255',
        src: '',
        alt: '',
        price: 0,
        title: '',
        quantity: 1     
      },
      {
        id: '256',
        src: '',
        alt: '',
        price: 0,
        title: '',
        quantity: 1     
      },
    ]
  },
]

При совпадении id выбранной карточки с card.id значение ключа quantity должно изменяться. Из-за глубокой вложенности объекта карточки не получается добиться нужного результата. Помогите, пожалуйста, разобраться в этом.

Comments

[WbICHA]

const card = products.flatMap(p => p.cards).find(c => c.id === id)
if(card) {
  card.quantity = newQuantity
}

По описанию мутация, в тегах реакт...

Answer 1

[0xD34F]

setProducts(products => products.map(n => {
  const card = n.cards.find(m => m.id === id);
  return card
    ? {
        ...n,
        cards: n.cards.map(m => m === card
          ? { ...m, quantity: newQuantity }
          : m
        ),
      }
    : n
}));

Comments

[Kirill1973]

Большое спасибо за оперативный ответ! Буду разбираться - мне нужно будет перенести ваше решение в reducer Redux.