日本免费高清视频-国产福利视频导航-黄色在线播放国产-天天操天天操天天操天天操|www.shdianci.com

學無先后,達者為師

網站首頁 Vue 正文

在vue中audio標簽借助refs時候獲取duration返回NaN

作者:咸魚都能看懂的代碼 更新時間: 2022-04-14 Vue

最近進行音樂網站開發,遇到了想借用audio的duration來獲取歌曲總時長,但是返回來一直是NAN,查詢了半天也沒有出結果。

然后我自己觀察到,只有我點擊過快時候出現了NAN,個人猜測可能是因為獲取歌曲時候,進度條沒有加載完,也就是說在歌曲還沒加載完,我們就去獲取總時長

奈何本人技術不好,最后想到定時器,設置 兩秒時間,這樣就可拿到數據了

 setTimeout(() => {
                console.log(this.$refs.audio.duration)
            }, 2000);

以上方法也能獲取,今天詢問了一下朋友,終于找到正確的方法了。

拿到NAN是因為音樂未加載完成,這時候需要在audio標簽添加

@canplay="canplay"

這樣我們在下面canplay(){

//此處獲取音樂總時長

}

前面

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了

原文鏈接:https://blog.csdn.net/qq_43644046/article/details/123532976

欄目分類
最近更新