javascript - 无法让 Meteor 与轻量级 JS 触摸库 Hammer.js 配合使用

Question

我已阅读 the existing posts关于在 Meteor 中集成触摸事件。

明智的做法似乎是，虽然 API 仍在不断发展，但最好避免使用基于包的方法，而只使用轻量级库来处理在客户端上显式包含的触摸事件。

我想我应该尝试一下 hammer.js 。 (我不想要大量的 JQuery 移动设备。)

我可以让它在 Meteor 之外正常工作。

在 Meteor 中，我只是尝试其演示代码的简单版本:

var $sw = $('#swipeme');
$sw.on('hold tap swipe doubletap transformstart transform transformend dragstart drag dragend swipe release', function (event) {
event.preventDefault();
console.log("Type: " + event.type + ", Fingers: " + event.touches.length + ", Direction: " + event.direction + "<br/>");
});

我都尝试过:

-主 application.js 文件中的 $(document).ready 内，以及

-定义为相关模板的 template.js 文件中的函数，然后我在该模板的事件对象内部调用:

Template.myTemplate.events = {
'click #myElement': function(){
myTouchFunction();
}
}

这两种方法都不起作用。

我做错了什么？

还有其他人在 Meteor 中成功集成了 JS 触摸库吗？我注意到jquery.fingers在其他帖子中引用过，但我也无法使其工作。

Answer 1

将 {{swipeme}} 添加到 myTemplate 并尝试使用 Meteor.defer ，它将在模板渲染后运行代码，确保它可以运行:

Template.myTemplate.swipeme = function () {
  Meteor.defer(function() {
    var $sw = $('#swipeme');
    $sw.on('hold tap swipe doubletap transformstart transform transformend dragstart drag dragend swipe release', function (event) {
      event.preventDefault();
      console.log("Type: " + event.type + ", Fingers: " + event.touches.length + ", Direction: " + event.direction + "<br/>");
    });
  });
};

或者，您也可以使用 Meteor.startup 但可能不能保证每次都能工作，因为它只运行一次(不知道它是否必须在第一个 DOM 之后运行)添加元素)，一旦更新或添加任何 DOM 元素，该方法将不起作用。