const botones = document.querySelectorAll(“.btn-primary”); // [Un array con 3 elementos botones]
const contenedor = document.getElementById(“carrito”);
const template = document.getElementById(“template”);
const fragment = document.createDocumentFragment();
let carrito = ;
const crearProducto = (e) => {
const producto = {
fruta: e.target.dataset.fruta,
id: e.target.dataset.fruta,
cantidad: 1,
};
const posicion = carrito.findIndex(item => {
return item.fruta === producto.fruta;
});
if(posicion === -1) {
carrito.push(producto);
} else {
carrito[posicion].cantidad++;
}
mostrarCarritoEnLaWeb();
};
const mostrarCarritoEnLaWeb = () => {
contenedor.textContent = "";
carrito.forEach(item => {
const clone = template.content.cloneNode(true);
clone.querySelector(".lead").textContent = item.fruta;
clone.querySelector(".badge").textContent = item.cantidad;
fragment.appendChild(clone);
});
contenedor.appendChild(fragment);
};
botones.forEach(item => {
item.addEventListener(“click”, crearProducto)
});