获取当前播放时间：$('video').currentTime

ended 属性返回音频/视频是否已结束。

myVid.ended

返回true/false

paused 属性返回音频/视频是否已暂停。

play() 方法开始播放当前的音频或视频。

pause() 方法停止（暂停）当前播放的音频或视频。

timeupdate

当目前的播放位置已更改时

ended	当目前的播放列表已结束时
error	当在音频/视频加载期间发生错误时

pause	当音频/视频已暂停时
play	当音频/视频已开始或不再暂停时

duration

返回当前音频/视频的长度（以秒计）

vue

<audio ref="audio" :src="currentSong.url" @play="ready" @error="error" @timeupdate="updateTime"
           @ended="end"></audio>

<div class="progress-wrapper">
            <span class="time time-l">{{format(currentTime)}}</span>
            <div class="progress-bar-wrapper">
              <progress-bar :percent="percent" @percentChange="onProgressBarChange"></progress-bar>
            </div>
            <span class="time time-r">{{format(currentSong.duration)}}</span>
          </div>

methods: {

      ready() {
        this.songReady = true
        this.savePlayHistory(this.currentSong)
      },
      error() {
        this.songReady = true
      },
      updateTime(e) {
        this.currentTime = e.target.currentTime
      },
      format(interval) {
        interval = interval | 0
        const minute = interval / 60 | 0
        const second = this._pad(interval % 60)
        return `${minute}:${second}`
      },

    _pad(num, n = 2) {
        let len = num.toString().length
        while (len < n) {
          num = '0' + num
          len++
        }
        return num
      },

}

如何绑定事件

对照着看，js使用onclick注册事件，angularJS使用ng-click指令注册事件。

step1，使用类似的v-on:click指令

它的特点，首先是“一次绑一个”，这种内联的方式只能一次绑定一个方法，要绑定多个方法，还得使用原生的javascript的原生方法addEventListener方法。然后，指令的限定表达式除了是一个方法名还可以是js语句。第三，它有缩写，"@click"。

step2，methods配置

对应的方法需要在Vue实例中的methods属性中进行定义。

step3:使用特殊变量$event访问原生DOM事件(optional，补充了解)