vue.js - 多次加载组件时，eventBus 正在监听重复事件

Question

我正面临着 vue.js eventBus 的非常重要和奇怪的问题。

我的代码是这样的，

mounted: function() {
    eventBus.$on('load-item', () => {
        // some loading data ajax 
    })
}

所以，如果我第一次进入这个组件，它只会执行一次。但是如果我切换到其他组件然后再次回到这个组件，事件会发出一次，但监听器正在执行这个函数 2 次。所以每次我访问这个组件时，它都会越来越多地加载数据。第三次 3 Ajax 请求。第四次 4 ajax 等等。

我试过以下解决方案，

beforeDestroy: function () {
    eventBus.$off('load-item');
}

所以上面的代码将删除监听器，它是否只有在销毁组件时才起作用。但就我而言，如果另一个 View 使用相同的组件，则会出现相同的问题。

我的问题是，当我们更改页面时，完全删除事件监听器的最佳方法是什么？

vue.js 中已经有什么东西了吗？

如果你不清楚，我可以详细解释。

Answer 1

也许您需要 eventBus.$once而不是 eventBus.$on在执行后使用 $once 时，除非再次初始化，否则它将不再被调用