Как правильно организовать удаление объектов из двух массивов на основе одинакового ключа в localStorage?

Question

[Andy Koshman]

Всем доброго времени, вопрос касается удаления объектов из localStorage. Имеется корзина в которую при клике отрендерилась карточка с данными и записалась в localStorage под ключом "cabins" который получаю c помощью getItem как currentTariff, при клике на "крестик" карточка удаляется вместе с e.target объектом из массива currentTariff в localStorage. функционал удаления объектов из currentTariff отрабатывает правильно. При переходе на следующую страницу и заполнении формы добавляется еще один массив passengers в localStorage. При возвращении на страницу с корзиной нужно реализовать правильное удаление объектов из массивов currentTariff и passengers на основе их общего ключа cabinCategoryID. Подскажите пожалуйста как это можно реализовать.

// 2 массива из localStorage
 let currentTariff = [{
     cabinCategoryID: 1,
   },
   {
     cabinCategoryID: 2,
   }
 ]
 let passengers = [{
     name: 'Bob',
     cabinCategoryID: 1,
   },
   {
     name: 'Jack',
     cabinCategoryID: 2,
   }
 ]

 /*  let currentTariff = JSON.parse(localStorage.getItem("cabins") || "[]");
  let passengers = JSON.parse(localStorage.getItem("Passengers") || "[]"); */

 function updateState() {
   localStorage.setItem("cabins", JSON.stringify(currentTariff)); //создание ключа "cabins"
 }

 function deleteState(index, idxPass) { // функия удаления объектов из массивов currentTariff и passengers
   if (index > -1) {
     currentTariff.splice(index, 1);
     updateState();
   }
   if (idxPass > -1) { // вот тут не получается удалять "выбранные объекты" 
     let passDel = passengers.splice(idxPass, 1);
     console.log("delete pass: ", passDel);
   }
 }

 function removeItem(e) { // функция удаления карточки
   if (e.target.classList.contains("tariff__port-close")) { // "крестик" на карточке
     let info = e.target.closest(".sidebar-item"); // сама карточка
     let idxCabin = [...sidebarInfo.children].findIndex( // удаление карточки из рендера 
       (el) => el.querySelector(".tariff__port-close") == e.target
     );

     // организация удаления второго объекта из массива passengers
     // нужно удалить из двух массивов currentTariff и passengers объекты с одинаковым cabinCategoryID 
     let idxPass = currentTariff.findIndex((cabin) => // сравниваю ключи из двух массивов  
       passengers.some(
         (cabinPass) => cabin.cabinCategoryID === cabinPass.cabinCategoryID
       )
     );
     deleteState(idxCabin, idxPass);
     info.remove();
   }
 }

Answer 1

[Alex Step]

У вас индекс idxPass явно ищется не в том массиве

const idxPass = passengers.findIndex(p => String(p.cabinCategoryID) === String(currentTariff[idxCabin].cabinCategoryID)))

Comments

[Andy Koshman]

Спасибо, я попробовал ваш вариант и получилось что то на подобии:

let idxPass = passengers.findIndex((p) =>
                        String(p.CabinCategoryID) ===
                        String(currentTariff[idxCabin].CabinCategoryID) );
                deleteState(idxCabin, idxPass);

function deleteState(index, idxPass) {
if (index > -1) {
                currentTariff.splice(index, 1);
                updateState();
}
if (idxPass > -1) {
            passDel = passengers.splice(idxPass, 1);
            localStorage.setItem("Passengers", JSON.stringify(passDel));
}
}

Удаление в принципе работает, но удаляет не правильно. Где может быть ошибка подскажите пожалуйста.