在es6类中从addEventListener触发handleEvent()

时间:2019-07-12 12:57:55

标签: javascript event-handling addeventlistener es6-class

昨天我了解到,使用addEventListener可以使用handleEvent()方法而不是回调函数来传递对象,因此我正在尝试实现这一目的。

我指的是this article,以及其他一些解释同一件事的信息。

我认为我的代码是正确的,但出现错误:menuBuilder.js:78 Uncaught TypeError: toggleMobileNav.addEventListener is not a function

这基本上就是我的意思

class menuBuilder {
  constructor() {
    this.addMobileNavEventListeners();
  }

  handleEvent(event) {
    if (event.type === 'click') {
      // Close the Submenus from Mobile Nav
      if (event.target.closest('.mobile-control-close-submenus')) {
        this.submenus.close();
      }

      // Open / Close Mobile Nav
      if (event.target.closest('.mobile-control-toggle-nav')) {
        this.toggleMobile();
      }
    }
  }

  addMobileNavEventListeners() {
    // Adds Event Listeners for mobile nav...
    // Close Submenu from Mobile Nav
    [...document.querySelectorAll(".mobile-control-close-submenus")].forEach((closeSubMenusIcon) => closeSubMenusIcon.addEventListener("click", this, false));

    // Open / Close Mobile Nav
    [...document.querySelectorAll('.mobile-control-toggle-nav')].forEach((toggleMobileNav) => toggleMobileNav.addEventListener("click", this, false));
  }
}

我对es6和香草javascript很陌生。我已经在jQuery领域居住了太长时间了,但是我已经掌握了很多东西(我想,哈哈),任何帮助都非常感激!

0 个答案:

没有答案