[Vuejs]-How to remove an event in Vue?

by

3đź‘Ť

âś…

Your code is already removing the event listener correctly, but there’s a couple other problems:

onPasteEvent returns a function, so when the paste event occurs, the handler only returns a new function (which does not get executed), so it’s basically doing nothing useful.

To fix the paste event handler, convert the returned function into the onPasteEvent function itself:

export default {
  methods: {
    async onPasteEvent (event) {
      try {
        const items = event.clipboardData.items
        const files = await this.getBase64Files(items)

        this.transferedItems = files
        this.modal = true
      } catch (error) {
        this.$toast.error('Não foi possível detectar um arquivo na área de transferência.')
      }
    }
  }
}

And if you’re using Vue 3, the beforeDestroy hook from Vue 2 is renamed to beforeUnmount:

export default {
  // beforeDestroy() { ❌ renamed in Vue 3

  beforeUnmount() { âś…
    document.removeEventListener('paste', this.onPasteEvent)
  },
}

demo

👤tony19

Leave a comment