在一次Vue项目开发中,给window绑定了addEventListener事件,然后在离开组件的时候调用removeEventListener移除事件,但是发现没有生效

错误示例

下面这样操作,是无法移除事件的

created() {
    window.addEventListener('mousemove', () => {
      console.log(1111)
    })
  },
  beforeDestroy() {
    window.removeEventListener('mousemove', () => {
      console.log(1111)
    })
  }

正确示例

后来查找到Vue中事件监听的第二个参数处理函数需要绑定到this上,并且removeEventListener 和 addEventListener 中对应的参数要一致

created() {
    window.addEventListener('mousemove', this.eventHandler)
  },
  beforeDestroy() {
    window.removeEventListener('mousemove', this.eventHandler)
  },
methods: {
  eventHandler(e) {
     console.log(1111)
  }
}
Logo

前往低代码交流专区

更多推荐