时间戳

首页 > 解决方案 > removeEventListener 没有在 keydown 上删除事件

javascript - removeEventListener 没有在 keydown 上删除事件

问题描述

每当我的组件被渲染时，我都会附加一个事件监听器。

 mounted() {
    window.addEventListener("keydown", e => this.moveIndex(e));
}

即使它在 moveIndex 方法本身内部，也不会删除事件侦听器。这是我尝试删除事件的方法。

 moveIndex(e) {
    ...
      case 0:
        player.play({
           uri: "https://tv-trtturk.live.trt.com.tr/master.m3u8"
          });
          window.removeEventListener("keydown", e => this.moveIndex(e));
       break;
   ...
}

即使我尝试通过按钮单击事件删除此事件，它也不会被删除。有什么我想念的吗？

标签： javascriptvue.js

解决方案

removeEventListener要求监听器相同：

EventTarget.removeEventListener() 方法从 EventTarget 中移除之前使用 EventTarget.addEventListener() 注册的事件侦听器。

由于(e => this.moveIndex(e)) !== (e => this.moveIndex(e))，他们被视为不同的听众。

它应该是

window.addEventListener("keydown", this.moveIndex);

和

window.removeEventListener("keydown", this.moveIndex);

由于moveIndex接受e作为参数并且 Vue 将方法绑定到组件实例，this.moveIndex因此可以安全地用作回调。

推荐阅读