天天看点

vue-aplayer:一个音乐播放器vue-aplayer

vue-aplayer

一个音乐播放器控制组件

git地址

https://github.com/SevenOutman/vue-aplayer

安装

npm install vue-aplayer --save
           

页面使用

<template>
  <div>
    <aplayer autoplay :music="{
     title: titlel,
     author: '东软君转载',
     url: mpurl,
     lrc: '[00:00.00]lrc here\n[00:01.00]aplayer'
    }">
   </aplayer>
  </div>
</template>

<script>
import Aplayer from 'vue-aplayer'
export default {
  name: '',
  components: {
          Aplayer
      },

  data () {
    return {
      mpurl:'',
      titlel:'',
    }
  },
  created(){
     //我用手机开的热点 192.168.43.107是ip,8888本地测试的端口号
      var qianurl="http://192.168.43.107:8888/resources/"
      //this.$route.query.keyY ->请求地址的参数值,参数名:keyY
      this.titlel = this.$route.query.keyY
      this.mpurl = qianurl+this.$route.query.keyY
      console.log(this.mpurl)

  },
  methods: {

  }
}
</script>

<style scoped>

</style>
           

手机界面

和pc端界面差不多

vue-aplayer:一个音乐播放器vue-aplayer

参考文章

1.https://segmentfault.com/a/1190000013029624

2.https://www.npmjs.com/package/vue-aplayer