对象包含的元素上的事件侦听器

Question

我正在建立一个电子商务网站并采用面向对象的方法。我陷入了两难境地，我不太确定如何解决此问题。

因此，我有负责渲染购物车视图的类，我们称其为CartView，它还具有一些功能，允许您从购物车中添加和删除项目，并将事件侦听器附加到添加/删除按钮。每次添加或删除时，都会重新渲染购物车并创建一个新的购物车。但是，与此同时，事件侦听器又被添加到其中。因此，每次重新渲染购物车时，都会以递增的方式添加另一个事件侦听器。因此，在购物车的第5次重新渲染时，每次点击会触发5个事件。

我的代码示例如下： Store.js

Store.prototype.onUpdate = function(itemName) {
    console.log('onUpdate');
    console.log(this);
    if (itemName) {
        var cart = document.getElementById("modal-content");
        var itemId = "product-" + itemName;
        var container = document.getElementById("productView");
        /*
            Below program crashes if our productView does not contain the item, we need
            a seperate communication with the server.
        */
        if (!document.getElementById(itemId)) {
            console.log(itemId + " does not exist in productView");
        } else {
            var currentItem = new ProductView(document.getElementById(itemId), this, itemName); 
            if (!nodeTraversal.findNode(container, document.getElementById(itemId))) {
                console.log('element does not exist');
                container.appendChild(currentItem);             
            } else {
                console.log('element does exist');
                var nodeToBeReplaced = document.getElementById("product-" + itemName);
                nodeTraversal.findReplacedNode(container, document.getElementById(itemId), nodeToBeReplaced);
            }           
        }

        console.log('cart', cart.childNodes);
        var cartView = new CartView(cart, this);
        cartView.initEvents(cart, this);
    } else {
        var stock = Object.keys(this.stock)
        var productsList = new ProductsView(document.getElementById("productView"), stock, this);
    }       
};

CartView.js

CartView.prototype.registerAddClickEventListeners = function(parent, storeInstance) {
    console.log(parent);
    console.log(parent.getAttribute('cartAddEvent'));
    if (parent.getAttribute('cartAddEvent') !== 'true') {
        console.log('Adding event for cart modal - add');
        parent.addEventListener("click", addClickEventListener(storeInstance), {once : true});
    }
}

function addClickEventListener(storeInstance) {
    return function(e) {
        if (e.target !== e.currentTarget && e.target.classList.contains("btn-add")) {
            var product = e.target.parentNode.classList.item(0);
            var elementClicked = e.target;
            elementClicked.setAttribute('cartAddEvent', 'true');
            storeInstance.addItemToCart(product);
            storeInstance.timer.resetTimer();
        }
        e.stopPropagation();        
    }
}

如何使事件仅添加一次？理想情况下，我希望使用纯JavaScript进行反馈。谢谢！