1.监听audio的timeupdate事件
1 <audio ref="audio" :src="currentSong.url" @play="ready" @error="error" @timeupdate="updateTime" 2 @ended="end"></audio>
2.事件方法:
1 updateTime(e) { 2 this.currentTime = e.target.currentTime 3 },
3.格式化时间显示:
1 format(interval) { 2 interval = interval | 0 3 const minute = interval / 60 | 0 4 const second = this._pad(interval % 60) 5 return `${minute}:${second}` 6 },
4.页面显示:
1 //已经播放时间 2 <span class="time time-l">{{format(currentTime)}}</span> 3 //总播放时间 4 <span class="time time-r">{{format(currentSong.duration)}}</span>