You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
107 lines
2.5 KiB
107 lines
2.5 KiB
<template>
|
|
<div></div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'AudioPlayer',
|
|
props: ['src'],
|
|
data() {
|
|
return {
|
|
backgroundAudioManager: null,
|
|
currentTime: 0,
|
|
duration: 0,
|
|
timeUpdateTimer: null
|
|
}
|
|
},
|
|
mounted() {
|
|
this.backgroundAudioManager = wx.getBackgroundAudioManager()
|
|
|
|
// 设置音频信息
|
|
this.backgroundAudioManager.title = '有声电子书'
|
|
this.backgroundAudioManager.epname = '章节播放'
|
|
this.backgroundAudioManager.singer = 'EpicSoul'
|
|
this.backgroundAudioManager.coverImgUrl = ''
|
|
|
|
// 监听播放事件
|
|
this.backgroundAudioManager.onPlay(() => {
|
|
this.startTimeUpdate()
|
|
this.$emit('play')
|
|
})
|
|
|
|
// 监听暂停事件
|
|
this.backgroundAudioManager.onPause(() => {
|
|
this.stopTimeUpdate()
|
|
this.$emit('pause')
|
|
})
|
|
|
|
// 监听停止事件
|
|
this.backgroundAudioManager.onStop(() => {
|
|
this.stopTimeUpdate()
|
|
this.$emit('pause')
|
|
})
|
|
|
|
// 监听播放结束事件
|
|
this.backgroundAudioManager.onEnded(() => {
|
|
this.stopTimeUpdate()
|
|
this.$emit('ended')
|
|
})
|
|
|
|
// 监听错误事件
|
|
this.backgroundAudioManager.onError((err) => {
|
|
console.error('背景音频播放错误:', err)
|
|
this.stopTimeUpdate()
|
|
})
|
|
|
|
// 设置音频源
|
|
if (this.src) {
|
|
this.backgroundAudioManager.src = this.src
|
|
}
|
|
},
|
|
methods: {
|
|
play() {
|
|
if (this.backgroundAudioManager.src) {
|
|
this.backgroundAudioManager.play()
|
|
}
|
|
},
|
|
pause() {
|
|
this.backgroundAudioManager.pause()
|
|
},
|
|
seek(time) {
|
|
this.backgroundAudioManager.seek(time)
|
|
},
|
|
startTimeUpdate() {
|
|
this.stopTimeUpdate()
|
|
this.timeUpdateTimer = setInterval(() => {
|
|
this.currentTime = this.backgroundAudioManager.currentTime || 0
|
|
this.duration = this.backgroundAudioManager.duration || 0
|
|
this.$emit('timeupdate', {
|
|
currentTime: this.currentTime,
|
|
duration: this.duration
|
|
})
|
|
}, 100)
|
|
},
|
|
stopTimeUpdate() {
|
|
if (this.timeUpdateTimer) {
|
|
clearInterval(this.timeUpdateTimer)
|
|
this.timeUpdateTimer = null
|
|
}
|
|
}
|
|
},
|
|
watch: {
|
|
src(newSrc) {
|
|
if (newSrc) {
|
|
this.backgroundAudioManager.src = newSrc
|
|
}
|
|
}
|
|
},
|
|
beforeDestroy() {
|
|
this.stopTimeUpdate()
|
|
// 注意：不要销毁backgroundAudioManager，因为它是全局的
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
/* AudioPlayer组件样式 */
|
|
</style>
|