title: How add VueJS event listenner on a component in the mounted section
body: <p>I important a componant and I want to attach an event listenner to the button element which has the class <code>qkb-bubble-btn</code>.</p>
  <p>I understand the fact I should put this in the <code>mounted</code> section but I get the following error :</p>
  <pre><code>TypeError: Cannot read properties of undefined (reading 'getElementsByClassName')
  </code></pre>
  <p>Here is how I try to add the listenner :</p>
  <pre><code>&lt;script&gt;
  import {VueBotUI} from 'vue-bot-ui'
  import {subscribeUser} from &quot;../helpers/subscriptionHandler&quot;;
  //import {getAlerte} from &quot;../helpers/alerteHandler&quot;;
  
  export default {
  //...
    mounted() {
      this.document.getElementsByClassName('qkb-bubble-btn ')[0].addEventListener('click', this.onBubbleClick);
    },
    beforeDestroy () {
      navigator.serviceWorker.removeEventListener('message', event =&gt; {
        this.printPush(event);
      });
      this.document.getElementsByClassName('qkb-bubble-btn ')[0].removeEventListener('click', this.onBubbleClick);
    },
    methods: {
      onBubbleClick(){
        console.log(&quot;click bubble&quot;)
      }
    },
  }
  &lt;/script&gt;
  </code></pre>
  <p>How should I add the click event listenner to the <code>qkb-bubble-btn</code> element ?</p>