Vue-APlayer Vue 2.x component of APlayer, create music players with controls


This component is a wrapper for APlayer, made with Vue 2. You can simply import it in your project and pass the options you want to, in your component or data.


  • narrow: narrow style
  • autoplay: autoplay song(s), not supported by mobile browsers
  • mutex: pause other players when this player playing
  • theme: '#b7daff' theme color
  • mode:play mode, can be 'random' 'single 'circulation'(loop) or 'order'(no loop)
  • preload:the way to load music, can be 'none' 'metadata' or 'auto'
  • listmaxheight:max height of play list
  • music: music info



   <div id="myApp">
    <a-player autoplay :music="songs" ref="player"></a-player>


import VueAplayer from 'vue-aplayer'

export default {
  data() {
  return {
      songs: [
            title: 'Preparation',
            author: 'Hans Zimmer/Richard Harvey',
            url: '',
            pic: '',
            lrc: '[00:00.00]lrc here\n[00:01.00]aplayer'
  components: { 'a-player': VueAplayer},

Check the Demo or give it a star on GitHub.