vue block other script event listeners

<template>
  <div>
    <button @click="triggerEvent">Trigger Event</button>
  </div>
</template>

<script>
export default {
  methods: {
    triggerEvent() {
      // Prevent other script event listeners from executing
      document.body.removeEventListener('click', this.handleBodyClick);
      // Your custom event handling logic here
    },
    handleBodyClick() {
      // Event listener logic for 'click' on the body element
    },
  },
  mounted() {
    // Add event listener to the body element
    document.body.addEventListener('click', this.handleBodyClick);
  },
  beforeDestroy() {
    // Remove event listener when the component is about to be destroyed
    document.body.removeEventListener('click', this.handleBodyClick);
  },
};
</script>