HI everyone i'am having a issue in javascript I have to files in html and use one javascript for both but i'am getting this issue that it says selectors.cartItems: null
here's my code:
const renderCart = () => {
console.log('Rendering cart...');
console.log('selectors.cartItems:', selectors.cartItems);
if (selectors.cartItems) {
console.log('Cart body exists. Rendering cart items.');
selectors.cartItems.innerHTML = cart.map(({ id, qty }) => {
//gets products information
const product = products.find((x) => x.id === id);
const { title, image, price } = product;
const amount = price * qty;
return `
<div class="cart-item" data-id="${id}">
<img src="${image}" alt="${title}">
<div class="cart-item-details">
<h3>${title}</h3>
<h5>$${price}</h5>
<div class="cart-item-amount">
<i class="bi bi-dash-lg"></i>
<span class="qty">${qty}</span>
<i class="bi bi-plus-lg"></i>
<span class="cart-item-price">${amount}</span>
</div>
</div>
</div>
`;
}).join("");
console.log('Cart rendered successfully.');
}
};
I have try many things but not work.
I want to render this items in to my shoppincart bag to mention I have to different html file one is index.html and other one is cartshop.html and have one javascripte file used in both files.