Как обновить только один объект в стейт-массиве?

Question

[Иван]

Добрый день.
Учу React, знания закрепляю практикой - пишу свое небольшое приложение, ToDo List.
Захотелось реализовать функционал обновления уже созданного пункта, но совершенно не могу понять, как сделать это правильно.

В качестве данных пока использую заготовку типа:

const initialItems = [
  { message: 'Задача 1' , key: 1 },
  { message: 'Задача 2' , key: 2 },
  { message: 'Задача 3' , key: 3 }
]

В разметке пишу:

...
{arrMessage.map(card, => (
  <Card
    card={card}
    // сюда из компонента Card передаю данные карточки
    cardTransfer={onItemClick}
    key={card.key}
  />
))}
...

Обработчик клика по элементу:

function onItemClick(card) {
  setButton('Update');
  setAreaVisible(true);
  setAreaValue(card.message);
  // пустота
}

При клике на элемент списка появляется textarea с уже записанными данными, но вот как перезаписать новые именно в тот самый объект - не смог разобраться.
Находил разные статьи, в том числе и эту (Массивы объектов в state — как обновлять?), но не понял ответа.

Объясните, пожалуйста.

Answer 1

[Владимир]

Ты не понял куска кода ?

onItemHintClick = (index, e) =>
  this.setState(({ items }) => ({
    items: [
      ...items,
      [index]: {
        ...items[index],
        htogle: !items[index].htogle,
      },
    ],
  }));

Ну так тебе не реакт учить надо а Javascript.
https://developer.mozilla.org/en-US/docs/Web/JavaS...

Comments

[Иван]

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

[Владимир]

Иван, Я не кусок кода пересылал, а ссылку на спред. Если знаешь что это такое ответ должен быть понятен.