Создание аудиоплеера APlayer в Vue, манипулирование списком воспроизведения перерисовывает компонент, начиная воспроизведение заново - как я могу обойти это?

Question

У меня есть компонент игрока:

<template>
  <div class="player-wrapper">
    <player :music="playlist" ref="player"></player>
  </div>
</template>

<script>
import VueAPlyer from "vue-aplayer"

export default {
  components: {
    player: VueAPlyer
  },
  computed: {
    playlist() {
      return this.$store.state.playlist
    }
  }
}
</script>

<style>
</style>

И действие по добавлению песни:

ADD_SONG (state) {
    state.playlist.push(
      {
        title: 'Preparation2',
        author: 'Hans Zimmer/Richard Harvey',
        url: 'http://devtest.qiniudn.com/Preparation.mp3',
        pic: 'http://devtest.qiniudn.com/Preparation.jpg'
      }
    )
  }

Проблема заключается в том, что, когда я помещаю новую песню в список воспроизведения, компонент проигрывателя пересчитывает список воспроизведения и запускается заново.

Наличие такого объекта плейлиста кажется естественным для использования, но я не могу придумать способ предотвратить эту перезагрузку, кроме того, чтобы сам проигрыватель "наблюдал" за изменениями в плейлисте, а затем изначально приказал APlayer добавить песню в плейлист (который, я предполагаю, не будет воспроизводить аудио компонент) - который кажется очень тяжелым. Я упускаю очевидное решение?