问题复现
框架:Vue
组件:@liripeng/vue-audio-player
iOS
版本:14.4
注意:this.$refs.audio
是 <audio>
标签实例
- 当我点击进度条时设置了
currentTime
,例如this.$refs.audio.currentTime = 30
,但不执行播放。 - 点击播放按钮,执行
this.$refs.audio.play()
和window.setInterval(() => { console.log(this.$refs.audio.currentTime) }, 1000)
。 - 发现
console.log
打印出来的一直是之前设置的30
,正常播放后this.$refs.audio.currentTime
是会一直变化的。
问题解析
iOS 兼容性问题,具体为啥会这样,暂时没去深究。
解决办法
设置 currentTime
的后面执行播放操作然后马上暂停,例如:
this.$refs.audio.currentTime = 30
this.$refs.audio.play()
this.$refs.audio.pause()
类似问题
在 iOS
设备中,接口异步请求后执行 <audio>
播放,出现无法播放问题,解决办法是一样的。