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

  • Z时代
  • 2024-02-08
  • 分类：IT

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

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

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

回答：

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

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

回答：

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

回答：

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

回答：

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

以上是 请问vue如何移除监听事件？ 的全部内容， 来源链接： utcz.com/p/935523.html

回到顶部