Html5音频简介NaN时间，同时建立一个自定义播放器

Question

我的分钟持续时间和秒持续时间被设置为NaN一秒钟，然后切换到音乐持续时间的预期。

我的HTML中没有使用标签 该方法是在点击按钮时触发的。

我怎样才能阻止这种NaN的发生？

previousSong () {
  if (sound) {
    if (this.isPlaying && sound.currentTime > 5) {
      sound.currentTime = 0
    } else {
      sound.pause()
      sound = new Audio(require('assets/YES.mp3'))
      sound.play()
      // I assume some if statement is needed before eventListener
      sound.addEventListener('timeupdate', (update) => { this.updateTime(sound) })
    }
  }
},
updateTime (sound) {
  const timeMinutes = Math.floor(sound.currentTime / 60).toFixed()
  const timeSeconds = (sound.currentTime - timeMinutes * 60).toFixed()
  this.TimeMinutes = (timeMinutes >= 10) ? timeMinutes.toString() : '0' + timeMinutes.toString()
  this.TimeSeconds = (timeSeconds >= 10) ? timeSeconds.toString() : '0' + timeSeconds.toString()
  const durationMinutes = Math.floor(sound.duration / 60).toFixed()
  const durationSeconds = (sound.duration - durationMinutes * 60).toFixed()
  this.DurationMinutes = (durationMinutes >= 10) ? durationMinutes.toString() : '0' + durationMinutes.toString()
  this.DurationSeconds = (durationSeconds >= 10) ? durationSeconds.toString() : '0' + durationSeconds.toString()
}

Answer 1

你可以对持续时间分和持续时间秒使用反if语句。然后如果是NaN，就不要完成updateTime函数并返回。

if(!(DurationMinutes >= 0 || DurationMinutes < 0)){ /*is NaN*/ return; } 

Answer 2

我在updateTime()方法的开头添加了这行代码来解决这个问题。

const duration = sound.duration || 0