本文介绍了使用vue-aplayer插件时出现的问题的解决，分享给大家，具体如下：
安装
rush:bash;">
$ npm install vue-aplayer --save
使用
rush:js;">
utoplay :music="{
title: 'Preparation',author: 'Hans Zimmer/Richard Harvey',url: 'http://devtest.qiniudn.com/Preparation.mp3',pic: 'http://devtest.qiniudn.com/Preparation.jpg',lrc: '[00:00.00]lrc here\n[00:01.00]aplayer'
}">
// ES6
import Aplayer from 'vue-aplayer'
new Vue({
components: {
Aplayer
}
})
这些属性大部分跟Aplayer的选项一样
属性名
| 类型 |
默认值 |
描述 |
utoplay自动播放，为null表示不会自动播放显示歌词主题颜色culation'随机模式 sigle:单曲循环 circulation:列表循环 order:顺序播放（列表播放完即停止）Metadata,auto
歌曲信息
属性music既可以是包含歌曲信息的对象类型，也可以是包含这些对象的数组类型
属性名
| 默认值 |
描述 |
Nown'required文件的地址
事件
事件名
| 参数 |
描述 |
支持播放时触发错误出现时触发属性
刚刚接触vue-aplayer,从github上找到了用法，首先需要npm install vue-aplayer –save ，之后在组件中引入import VueAplayer from ‘vue-aplayer'，别忘了注册components: {
'a-player': VueAplayer
}
这里还有一个问题，用v-if,而不是v-show,因为是异步请求，所以一开始播放器中是没有歌曲的，所有给了个v-if不然会插件默认会先生成播放器，导致报错
–2017.12.2,现在的代码版本是这样的~
rush:xhtml;">
utoplay='true' :music="musicList">
还是有问题，网上查过之后，是因为在执行了play()方法以后立即执行pause()方法，至于解决方法……还在寻找中
之前遇到的问题是
~~~~想明白了一些
如果先给this.musicList赋值了，那么push之后就会酱紫，重复两遍
其实是很好想明白的哈。
补充的代码，看起来更直观
{
// let List = res.data.musicData;
// console.log(res);
this.musicList.forEach(element => {
let obj = {
title:element.title,lrc:"../static/"+element.lrc
}
this.musicList.push(obj);
console.log(this.musicList);
});
this.isShow=true;
console.log(this.musicList);
}).catch();
错误是这样的
正确的是酱紫的
内容，希望对大家的学习有所帮助，也希望大家多多支持编程之家。
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
