Max Wilson Pereira
Max Wilson Pereira

Reputation: 43

Audio don't play again on page refresh - React

My audio is being played when componentDidMount(). BUT it's not being played again when page refresh, although componentDidMount() is called again. Any idea how to obligate the audio to play again when page refresh?

  componentDidMount() {
    if (this.props.songsQuiz) {
      alert("componentDidMount");
      this.playNextSongHandler();
    }
  }
  playNextSongHandler = () => {
    if (this.state.songsQuiz[this.state.currentSong] && this.state.playSong) {
      this.state.songsQuiz[this.state.currentSong].play();
      return;
    }
  };

Upvotes: 1

Views: 1039

Answers (2)

Max Wilson Pereira
Max Wilson Pereira

Reputation: 43

I just found a walk around solution redirecting the page to itself IF/WHEN page refreshed. Probably there is a better solution, but I'm glad it worked. But now the page is being loaded two times. Hope someone comes up with a better solution. I did like this:

if (window.performance) {
  if (performance.navigation.type == 1) {
    alert("This page is reloaded");
    window.location.href = "/musicalquiz";
  } else {
    alert("This page is not reloaded");
  }
}

Upvotes: 0

Han
Han

Reputation: 11

It might be the store state hasn't been fully update on the state, ie: playSong is null before you calling them. You might consider adding a componentDidUpdate or using React.useEffect

Upvotes: 1

Related Questions