Удалить объект из массива?

Question

Удалить объект из массива не работает должным образом, но он отлично добавляет объект

const addItem =(selected)=>{
let data = selectedItems ? [...selectedItems] : [];
if (data.length) {
  let index = data.indexOf(selected);
  console.log(index);
  if (index !== -1) {
    data.splice(index, 1);
    setSelectedItems(data);
  } else {
    data.push(selected);
  }
} else {
  data.push(selected);
}
console.log("selected", selectedItems);

setSelectedItems(data);
}

функция кнопки рендеринга добавить или удалить при нажатии на нее

<div className="file-list">
  <MappedElement 
   data={[{ _id: 1 }, { _id: 2 }]}  
   renderElement={(value, index, arr) => { 
   let check=selectedItems.some((obj) => obj._id === value._id); 
   console.log("check", check); 
   return ( 
    <DocumentCard key={index} className={file-list-item ${check ? 
       "active" : ""}} 
    onClick={() => addItem(value, arr, index)} /> ); }} /> 
 </div> 

Answer 1

Для selectedItems массив, который выглядит так:

const selectedItems = [
    { _id: 1, /* other fields */ },
    { _id: 2, /* other fields */ },
    { _id: 3, /* other fields */ },
    /* other objects */
];

И selected объект, который выглядит так:

const selected = { _id: 1 };

Чтобы выполнить желаемое поведение, а именно: если элемент существует, удалите его, иначе добавьте его, вы можете написать следующее:

// copy selected items with a fail-safe empty array
const data = selectedItems ? [...selectedItems] : [];
// find index of selected element
const removalIndex = data.findIndex(({ _id }) => (_id === selected._id));
// if selected element exists in data array, remove it
if (removalIndex !== -1) {
    data.splice(removalIndex, 1);
}
// if selected element doesn't exist in data array, add it
else {
    data.push(selected);
}
// update selected elements
setSelectedItems(data);

ПРИМЕЧАНИЕ: если ваш массив выбранных элементов содержит дубликаты, то есть несколько объектов, которые содержат одно и то же значение для_id, то этот подход удалит только первый из них. Если вы хотите удалить их все, вам придется использовать цикл или рекурсивность.

Answer 2

Использовать

const addItem =(selected)=>{
let data = selectedItems ? [...selectedItems] : [];
if (data.length) {
  let index = data.findIndex(value => value._id === selected._id)ж
  console.log(index);
  if (index !== -1) {
    data.splice(index, 1);
  } else {
    data.push(selected);
  }
} else {
  data.push(selected);
}
console.log("selected", selectedItems);

setSelectedItems(data);
}

Answer 3

Вероятно, ваша проблема в indexOf метод, который вы используете.

Вы не можете использовать это для поиска объектов в вашем массиве.

Вы можете использовать несколько вариантов. Вы можете использовать find или findIndex и передать обратный вызов, чтобы найти объект по указанному (предпочтительно уникальному свойству объекта).

пример

let found = data.findIndex(item => item.id === selected.id);