使用 Require JS 的回调

Question

所以我正在尝试制作两个功能，允许用户将商品从他们的购物车移动到 "saved cart"，反之亦然。这些功能依赖于 "cart group item" 模块，该模块还包含按钮点击事件。我的问题是，我不确定如何正确调用这些函数以允许在我当前的 js 文件中发生点击事件。希望有人能帮忙！

事件在模块中：

cartGroupItem.prototype.createMoveEvent = function (elem) {
  if (undefined !== elem && null !== elem) {
    var button = elem.querySelector('.cartGroupItem__move');
    if (button !== null) {
      button.addEventListener('click', function (e) {
        ajax('GET',
               '/resources/ajax/cart.aspx?sub=3&Saved=0&Cart_Group_ID='+this.cartGroupId,
          true, {}, function () {
            this.moveToCartCallback();
          }.bind(this), function () {
            this.showErrorDiv();
          }.bind(this));
      }.bind(this));
    }
  }
};

cartGroupItem.prototype.createSaveEvent = function (elem) {
  if (undefined !== elem && null !== elem) {
    var button = elem.querySelector('.cartGroupItem__save');
    if (button !== null) {
      button.addEventListener('click', function (e) {
        ajax('GET',
               '/resources/ajax/cart.aspx?sub=3&Saved=1&Cart_Group_ID='+this.cartGroupId,
          true, {}, this.saveForLaterCallback.bind(this), this.showErrorDiv.bind(this));
      }.bind(this));
    }
  }
};

移动函数：

function moveToSaved(cartGroupId) {
    for (var i = 0, l = activeCartList.length; i < l; i++) {
        if (activeCartList[i].cartGroupId === cartGroupId) {
            activeCartList.remove();
            savedCartList.push(activeCartList[i]);
        }

    }
}

function moveToActive(cartGroupId) {
    for (var i = 0, l = savedCartList.length; i < l; i++) {
        if (savedCartList[i].cartGroupId === cartGroupId) {
            savedCartList.remove();
            activeCartList.push(savedCartList[i]);
        }
    }
}

Answer 1

您的 Event 模块可能定义了函数 cartGroupItem 对吗？

您需要做的是将此函数从其文件传递到您的当前文件，然后 "instanciate" 一个 carteGroupItem:

// In your current JS file
var myCartGroupItem = new cartGroupItem();
myCartGroupItem.createMoveEvent();
myCartGroupItem.createSaveEvent();

我们还需要查看此函数 "constructor"（定义的位置），因为它可能需要一些回调作为参数。否则您可以手动添加它们：

myCartGroupItem.moveToCartCallback = function() {
  // do what you want when the item is moved to cart
};
// Same for the other callbacks
myCartGroupItem.saveForLaterCallback = function() { ... };
myCartGroupItem.showErrorDiv = function() { ... };

最后，用 RequireJS 传递东西的方法是，例如，你的 Event 模块 returns cartGroupItem 所以在你的文件模块中：

define(['Event'], function(cartGroupItem) {
  // Your code where you can use cartGroupItem
});

使用 Require JS 的回调

Callbacks with Require JS

javascript

require