Vue.js：EventBus 被多次调用

Question

我正在构建“撤消删除”操作的逻辑。为此，我使用事件总线将事件发送到两个不相关的组件，如下所示：

Undo.vue:

EventBus.$emit(`confirm-delete-${this.category}`, this.item.id);

事件（this.category）的名称基于来自父级（ConfirmDeleteModal.vue）的道具，然后按如下方式接收：

CategoryA.vue

created() {
   EventBus.$on('confirm-delete-category-a', (id) => {
     this.confirmDelete(id);
   });
},

CategoryB.vue

created() {
    EventBus.$on('confirm-delete-category-b', (id) => {
      this.confirmDelete(id);
    });
},

我的问题：由于某种原因，事件category-a被发出和接收两次（category-b工作正常）。我必须confirm-event不断地监听，因此在收到事件或仅监听后我无法删除事件监听器$once。有什么想法可以解决这个问题（也许使用 Vuex）？谢谢！

Answer 1

我也面临着同样的问题，经过一番研究后，我得到了这个解决方案。

您在应用程序中定义了两次组件CategoryA.vue，这导致该函数运行两次（在本例中）CategoryA.vue

解决方案：您必须在点赞destroyed()后调用created() ：

created() {
    EventBus.$on('confirm-delete-category-a', (id) => {
      this.confirmDelete(id);
    }),
},
destroyed() {
    EventBus.$off('confirm-delete-category-a');
},