请问vue如何移除监听事件？

Question

mounted () {
    // 监听 ctrl+v键盘事件
    document.addEventListener('paste', (event) => {
      console.log('监听中')
      this.pasteText(event)
    })
  },
  beforeDestroy () {
    document.removeEventListener('paste', this.pasteText, true)
  },

目前是用的这个方法，但是发现监听事件并没有被正确移除，所以只要再创造这个实例就会多次触发监听事件，这是为什么呢？

Answer 1

添加和移除时函数不是同一个,而且还得保证第三个参数options是一致的，可以写成这样

mounted () {
    // 监听 ctrl+v键盘事件
    this.hander = (event) => {
      console.log('监听中')
      this.pasteText(event)
    }
    document.addEventListener('paste', this.handler)
  },
  beforeDestroy () {
    document.removeEventListener('paste', this.handler)
  },

Answer 2

document.addEventListener('paste',this.pasteText)

Answer 3

通过addEventListener()添加的事件处理程序只能使用removeEventListener()来移除；移除时传入的参数与添加处理程序时使用的参数相同。这也意味着通过addEventListener()添加的匿名函数无法移除

Answer 4

mounted () {
    const hander = (event) => {
      console.log('监听中')
      this.pasteText(event)
    }
    document.addEventListener('paste', hander)
    this.$once("hook:beforeDestroy", () => document.removeEventListener('paste', hander , true));

  }