@elo-dev

Как удалить конкретный элемент массива через кнопку?

Здравствуйте, ситуация такая, есть карточки, которые генирируются в js, у каждой свой id (1,2,3 и т.д), нужно сделать так, чтобы при нажатии на иконку корзины, удалялся именно тот элемент, на котором нажали на иконку корзины.
Вот мой код, но он удаляет только первый элемент массива, вне зависимости на какую иконку тыкнули, что в принципе логично - splice(1).
function render(id, img, title, rate, genere, sort) {
  let htmlCard = `
        <div class="col mb-4 cardVideo card-${id}">
        <div class="card">
          <img src="${img}" class="card-img-top" alt="...">
          <div class="card-body">
            <h5 class="card-title">${title}</h5>
            <div class="wrapper__footer-card">
              <span class="fa fa-star rating-star"></span>
              <span class="card-rate">${rate}</span>
              <span class="card-genere">${genere}</span>
              <span class="card-sort">${sort}</span>
            </div>
          </div>
          <div class="card__delete">
            <i class="fa fa-trash" aria-hidden="true" onclick="deleteCard(${id})"></i>
          </div>
        </div>
      </div>
      `;
  if (img !== '' && title && rate && genere && sort === "Сериалы") {
    blockSerials.innerHTML += htmlCard;
  } else if (img !== '' && title && rate && genere && sort === "Фильмы") {
    blockFilms.innerHTML += htmlCard;
  }
}

let dataParse = JSON.parse(localStorage.getItem("card"));
let id = 0;
if (dataParse) {
  dataParse.forEach((el) => {
    render(el.id, el.img, el.title, el.rate, el.genere, el.sort);
    id = el.id;
  });
} else {
  localStorage.setItem("card", JSON.stringify([]));
}

function deleteCard(id){
  const target = event.target.closest('.cardVideo');
    dataParse.splice(id, 1);
    target.remove();
    console.log(dataParse);
}
  • Вопрос задан
  • 112 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы