Как настроить добавление в корзину?

Question

[Zhenya Senkevich]

Есть массив объектов, выведен в HTML, по клику каждый добавляется к корзину, как сделать так что бы уже существующий элемент не добавлялся в корзину повторно? И как сделать кнопку очищающую корзину польностью?

spoiler

const goods = [
{
name: "car 1",
price: 100
},
{
name: "car 2",
price: 200
},
{
name: "car 3",
price: 300
}
]

const goodsInStorage = JSON.parse(localStorage.getItem("goods"));
const goodsInCart = goodsInStorage ? goodsInStorage : [];

const store = document.querySelector(".root");
const cart = document.querySelector(".cart");

const addItemFromStorage = () => {
goodsInCart.forEach((item) => {
const goodInCart = document.createElement("div")
goodInCart.innerText = `Марка ${item.name}, цена ${item.price}`;
cart.append(goodInCart)

})
}

const goodClicklHandler = (item) => {
item.addEventListener("click", function () {
cart.innerHTML = ""
const itemIndex = this.getAttribute("data-good-id")
goodsInCart.push(goods[itemIndex])

localStorage.setItem("goods", JSON.stringify(goodsInCart))

addItemFromStorage()
})
}

goods.forEach((good, index) => {
const item = document.createElement("div");
item.dataset.goodId = index;
item.innerText = `Марка ${good.name}, цена${good.price}`;
store.append(item);

goodClicklHandler(item);
});

addItemFromStorage()

Answer 1

[FinGanapre]

1. При добавлении в корзину проверять нет ли этого товара в корзине (У вас будут id товаров в реальном приложении, проверяйте по ним. В корзину в принципе складывают только id товаров)
2. Кнопки добавить в корзину уже не должно быть в карточке товара, если он в корзине. На её место можно вставить выбор количества товара (с мин и макс значение, вводом в ручную и + -), а также добавить кнопку удалить если отдел маркетинга не против (можно удалять выбором менее 1)
3. Очистка корзины = присвоение пустого массива. Из локала можно удалить так
4. Подобное лучше писать на фреймворках, т.к. без них придётся ручками контролировать ререндеринг интерфейса. Как минимум стоит описать это через класс.