Question

class SwipeController {
  constructor(threshold) {
    var myElement = document.getElementById('swipecontainer');


    myElement.width = $( window ).width();
    myElement.height = $( window ).height();

    var mc = new Hammer(myElement);
    mc.get('pan').set({ direction: Hammer.DIRECTION_ALL, threshold: threshold });

    this.swiperight = new Array();
    this.swipeleft = new Array();
    mc.on("panright", function(ev) {
      alert(this.swiperight)
    this.swiperight.forEach(function(func) {

      func();
    })
    });

     mc.on("panleft", function(ev) {
      this.swipeleft.forEach(function(func) {
        func();
      })
    });

  }

  set swipeRight(value) {
      this.swiperight.push(value)
  }

  set swipeLeft(value) {
      this.swipeleft.push(value)
  } 
}

module.exports = SwipeController;

我意识到alert（this.swiperight）显示为未定义，因为“this”不再是SwipeController类。我该怎么做呢？我正在尝试使这个事件触发器触发连接到它的任何事件，所以我可以从一个类处理我的所有滑动检测。

Answer 1

这是因为回调的this上下文不再是类的对象，而是触发事件的对象。要解决此问题，您可以在回调定义之前定义一个指向this并在回调中使用它的变量（因此不会引发此'名称冲突'）：

var _this = this;
mc.on("panright", function(ev) {
    alert(_this.swiperight);
    _this.swiperight.forEach(function(func) {
        func();
    });
});

mc.on("panleft", function(ev) {
    _this.swipeleft.forEach(function(func) {
        func();
    });
});

如何从事件中访问函数列表

1 个答案: