Vue中让Audio进度条同步

Vue中让Audio进度条同步

html代码

<audio :src="src" controls class="kxjjh"  ref="audio" @canplay="bofang" @timeupdate="timeupdate">
</audio>

 <van-slider v-model="value" bar-height="4px" active-color="#ee0a24" :max="max" @change="ssaa"/>

data里的数据

data() {
    return {
      value:0,
      max:'',
    }
  },

methods里的数据

 methods: {
    bofang(){
      console.log(this.$refs.audio.duration )
      this.max=this.$refs.audio.duration
    },
    ssaa(){
      this.$refs.audio.currentTime=this.value
    },
    timeupdate(){
      this.value=this.$refs.audio.currentTime
    }
  }
}