获取歌曲的播放时长

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>

 

posted @ 2018-08-13 10:22  前端极客  阅读(1451)  评论(0编辑  收藏  举报