javascript音频在 react 中当前播放时暂停先前播放的音频

Question

我在 React 中有一个简单的函数来播放音频..

handlePlayMusic() {

    this.audio = new Audio(music)
    this.audio.play()
}

handleStopMusic() {

    this.audio.pause()
}

当我播放新音乐时我。 e. Audio(music) 中 music 的值已更改，将播放新音乐，但之前播放的音乐将继续播放。我希望当我播放新音乐时停止它..

有什么帮助吗？

Answer 1

Stop the earlier instance of this.audio before playing it!

var obj = {
  handlePlayMusic: function(music) {
    try {
      this.audio.pause();
      this.audio.currentTime = 0;
    } catch (e) {
      console.log(e);
    }

    this.audio = new Audio(music);
    this.audio.play()
  },
  handleStopMusic: function() {

    this.audio.pause()
  }
};
obj.handlePlayMusic('audio/audio.mp3');

Fiddle Demo (首先加载音频!)