最近进行音乐网站开发,遇到了想借用audio的duration来获取歌曲总时长,但是返回来一直是NAN,查询了半天也没有出结果。
然后我自己观察到,只有我点击过快时候出现了NAN,个人猜测可能是因为获取歌曲时候,进度条没有加载完,也就是说在歌曲还没加载完,我们就去获取总时长
奈何本人技术不好,最后想到定时器,设置 两秒时间,这样就可拿到数据了
setTimeout(() => {
console.log(this.$refs.audio.duration)
}, 2000);
以上方法也能获取,今天询问了一下朋友,终于找到正确的方法了。
拿到NAN是因为音乐未加载完成,这时候需要在audio标签添加
@canplay="canplay"
这样我们在下面canplay(){
//此处获取音乐总时长
}
前面
<audio :src="musicdetail.play_url" @canplay="canplaysong" autoplay="true"></audio>
methods里面
canplaysong(){
let total=parseInt(this.$refs.audio.duration)
this.musictotaltimemode=total
let minute=total % 60
let seconds=(total-minute)/60
this.musictotaltime=seconds+':'+minute
},
这样就不会出现NAN了