Vue.js方法使用$ emit和$ on多次调用,只应调用一次

我正在使用总线允许组件通过此链接中描述的方法与其他组件交互:https://forum.vuejs.org/t/create-event-bus-in-webpack-template/4546/2 .

我有一个在创建的钩子中调用的方法,它使用总线发出一个事件.

created () {
  this.getReviewDeck()
},
myMethod () {
    bus.$emit('increment')
}

在另一个组件(包含在上面的组件中)中,我将事件监听器附加到创建的钩子中,如下所示:

created () {
  bus.$on('increment', this.incrementCount)
},
incrementCount () {
  console.log('count incremented')
}

如果我第一次访问组件一切正常,控制台将记录"计数递增"一次.但是,如果我离开组件然后导航回到它,下次"计数递增"将被记录两次,如果我离开并再次返回,它现在将被记录三次等.

我无法弄清楚究竟发生了什么或者如何最好地解决这个问题,这样每次我去组件时,消息只记录一次而不是多次.

不得不在destroy上删除事件处理程序.

 beforeDestroy () {
    EventBus.$off('increment', this.incrementCount)
 },

您可以使用$ .once

created () {
  bus.$once('increment', this.incrementCount)
},