audio标签报错: DOMException: The play() requestwasinterrupted by a new load request.

906 阅读1分钟

解决audio标签报错

<audio :src="url"></audio>

这是错误信息

DOMException: The play() request was interrupted by a new load request.

解决方法:

<button @click="play">
<audio
      ref="audio"
      :src="currentSong.url"
      @canplay="ready"
></audio>
export default {
	data(){
		return {
			audioReady: false
		}
	}
	methods:{
		ready(){
			this.audioReady = true
		},
		play(){
			// 解决方法一: 这个方法不需要添加以上ready方法
			this.$nextTicker(()=>{
				this.$refs.audio.play()
			})
			// 解决方法二:
			if(!this.audioReady){
				return
			}
			this.$refs.audio.play()
			this.audioReady = false
		}
	}
}

这里扩展一下,如果有切换歌曲的话 只能使用第二种方法 在每次切换都要判断