Vue中addEventListener踩坑记录

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

错误示例

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

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

正确示例

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

created() {
    window.addEventListener('onmessageWS', this.wsFunc)
  },
  beforeDestroy() {
    window.removeEventListener('onmessageWS', this.wsFunc)
  },
methods: {
  wsFunc(e) {
     console.log(1111)
  }
}

这个坑还是有点坑的