'Event listeners on elements in a Vue Modal: are they destroyed when the Modal is closed?

I'm adding an event listener for a DOM element in a component that exists within a Vue modal:

this.$bvModal.show('modal-upload-file')
this.$nextTick(() => {
        document.querySelector('#file').addEventListener('focus', () => {
          document.getElementsByClassName('file-uploads')[0].classList.add('btn-outline-primary')
          document.getElementsByClassName('file-uploads')[0].classList.remove('btn-primary')
        })
      })

The listener works great but I'd like to remove it when the Modal component closes; my application is an SPA and won't need it on other pages. Though I know that I can just use removeEventListener, my question is whether the event listeners are destroyed automatically when the Modal is closed since the elements inside the Modal no longer exist.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source