Nuxt Js Event Fires дважды

Question

Я использую Nuxt js SSR для приложения, которое я собираю, я установил плагин Vue Event, но когда я запускаю событие, он дважды запускается на слушателе. Созданный крюк тоже работает дважды.

Модули использую: Axios, Auth, Toast

Дочерний компонент

methods: {
  initPlaylist(songs) {
    console.log(songs)
  }
},
mounted () {
  this.$events.$on('playAll', data => {
    this.initPlaylist(data.songs) //runs twice
  })
}

Родительский компонент

method () {
    playAll (songs) {
      this.$events.$emit('playAll', songs)
  }
 }

Как я могу решить эту проблему, ребята? Мне нужна ваша помощь.

Answer 1

Возможно, вам нужно вызывать метод этого родителя только на стороне клиента.

Вы можете написать код, подобный этому, чтобы предотвратить выброс на стороне сервера:

methods: {
  playAll(songs) {
    if (process.server) return

    this.$events.$emit('playAll', songs)
  }
}

или не вызывайте метод playAll на стороне сервера. (например: создано, установлено...)

Answer 2

Вам нужно сначала отключить это событие.

      this.$events.$off("playAll");
this.$events.$on('playAll', data => {
    this.initPlaylist(data.songs) //runs twice
})