Правильно ли удаляю элемент из списка на React?

Question

[NiyazNA]

Здравствуйте! Изучаю Реакт. Прочел Main Concepts в документации. Решил сделать простой туду лист. Реализовал удаление элемента списка вот так (гуглением):

this.setState(prevState =>({
      todoItems: prevState.todoItems.filter(itemKey => itemKey != deletedItemsKey)
}));

Но мне непонятно, неужели, чтобы удалить элемент, нужно перебирать ключи всех элементов списка и сравнивать их с ключом удаляемого элемента? Например в нативном JS можно же просто event.target.parentNode.removeChild(event.target), где event.target - это удаляемый элемент.

Answer 1

[Антон Спирин]

В React вы рендерите список на основе данных:

<List>
  {data.map(item => <Item key={item.id} item={item} />)}
</List>

При обновлении state c иммутабельным удалением элемента произойдет перерисовка компонента и сверка новой версии древа нод со старой, отсутствующие в новой версии элементы будут удалены из DOM.
Lists and keys
Reconciliation