在使用audio播放音频中,需要拖动进度条,来使音频可以快进,单纯的使用currentTimes改变属性值,是不会生效的。
audio.currentTimes = 100 //这样改变不会生效
可以使用audio中的seekable 属性,来设置音频中可寻址(移动播放位置)的时间范围。该属性可以寻址到音频的中的任何位置,即使该音频没有完成缓冲。
- //点击进度条更新进度
- clickProgress(e) {
- // this.audio.pause()
- if ('seekable' in this.audio) {
- console.log(this.audio.seekable.start(0))
- console.log(this.audio.seekable.end(0))
- // let start = this.audio.seekable.start(0)
- // let end = this.audio.seekable.end(0)
- } else {
- this.$message.waring("你的浏览器不支持该功能!")
- return
- }
- //如果不是正在移动 和 没有暂停播放就执行
- if (!this.isMoveIn || !this.audio.paused) {
- this.updateProgress(e.offsetX)
- this.$refs.cd.classList.add('rotate')
- if (this.$refs.cd.classList.contains('rotatePause')) this.$refs.cd.classList.remove('rotatePause')
- }
- },
console.log(this.audio.seekable.start(0))
console.log(this.audio.seekable.end(0))
项目中使用console 输出的该值,如果在此处只是调用的话并不会生效。项目中对这俩值又没有太多需求,暂时只能这样做了,有好的解决方法的,欢迎大佬指出。