vue录音播放插件a-player使用
作者:chrispy
<div v-show="recordHasData" id="player-box-id">
<aPlayer :music="soundList" :showlrc="false" :narrow="false" theme="#b7daff" mode="order" v-if="flag" listmaxheight='96px' ref="player"></aPlayer>
</div>
import aPlayer from 'vue-aplayer'
data里配置:
soundList:{
title: '',
author: '',
url: '录音文件地址',
// pic: 'http://devtest.qiniudn.com/Preparation.jpg',
pic: '@/assets/img/player-bg.png',
lrc: '[00:00.00]lrc here
[00:01.00]aplayer',
},
components:{
aPlayer
},
methods里
//点击查看录音详情
viewSoundRecordDetail(index,row){
this.detailDialogVisible=true
let recordText=JSON.parse(row.recordText)
this.recordListText=recordText
let recordUrl=row.recordUrl
recordUrl=recordUrl.replace('http://account-staging.zichan360.com/','http://account.zichan360.com/')
this.soundList.url=recordUrl
//异步加载,先加载出player再使用
this.flag = true
if(this.$refs.player){
let aplayer = this.$refs.player.control
if(aplayer){
aplayer.play()
}
}
},