[Vuejs]-Cannot remove items from cart in vue 3 with pinia

0👍

Splice uses the index of the item to delete it.

Do this instead;

removeFromCart(id) {
    let cartItemIndex = this.cart.findIndex(x => x.id === id);

    if (cartItemIndex >= 0) {
        this.cart.splice(cartItemIndex, 1);
        console.log("Removed from cart");
    }
}

or if you don’t want to use splice anymore (and if performance matters);

removeFromCart(id) {
    this.cart = this.cart.filter(x => x.id !== id);
    console.log("Removed from cart");
}

Please use more descriptive parameter names. Rename "id" to "item" in addToCart, since you’re not just adding the item id, but the entire item. This can be confusing to other developers and make your code unreadable.

addToCart(item) {
    this.cart.push(item)
    console.log('test passed!')
}

References: splice filter

Leave a comment