使用拼接方法的问题，总是删除第一项

Question

I'm having a problem removing an item from a "cart". Each time i'm clicking on delete, it's deleting the right element from the DOM, but it's always deleting the first element from my array/localStorage. I know the problem is in my splice method, but i have literally no idea about what to do. If more informations are required, i can provide the github it's located on Thanks in advance

  let cartItms = JSON.parse(localStorage.getItem("Cart"));
  let productId = JSON.parse(localStorage.getItem("productId"));
  let optionSelected = JSON.parse(localStorage.getItem('Lense'));
  let totalPrice = 0;
  const shoppingCart = document.querySelector('.cart__content--items');

    function deleteProduct() {  
    shoppingCart.addEventListener('click', (e) => {
      e.preventDefault();
      //Remove item from cart
      if(e.target.classList[0] === "cart__content--item__delete") {
        e.target.parentElement.parentElement.remove();
        cartItms.splice(e.target,1);
        productId.splice(e.target,1);
        optionSelected.splice(e.target,1);
        localStorage.setItem('Cart', JSON.stringify(cartItms));
        localStorage.setItem('productId', JSON.stringify(productId));
        localStorage.setItem('Lense', JSON.stringify(optionSelected));
      }
      //Recalculate the price of current cart
      totalPrice = 0;
      cartItms.forEach((data) => {
        totalPrice += data.price/100;
      })
      document.querySelector('.cart-content').innerHTML = '('+ cartItms.length +')';
      document.querySelector('.total-price').innerHTML = totalPrice + "€";
    })
} 

Answer 1

Assuming cartItms is an array, then you can use.

cartItms.shift();

The shift() method removes the first element from an array and returns that removed element. This method changes the length of the array.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/shift