title: Stop Audio on Route Change in React?
body: <p>everyone. I'm still getting used to React and React Router, and this is one thing I have no figured out.</p>
  
  <p>So, I have an app that plays a video (muted) and an audio track at the same time. I am using <a href="https://github.com/CookPete/react-player" rel="nofollow" title="react-player">React Player</a> to play both. My view looks like this (VideoPlayer is the react-player tag):</p>
  
  <pre><code>&lt;div&gt;
      &lt;VideoPlayer url={this.props.audio} playing={this.state.playing} /&gt;
      &lt;VideoPlayer url={this.props.video} playing={this.state.playing} /&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>This setup has worked for me, and I am able to play and control them both via a common state. I can stop them via an event handler I hooked up to a button:</p>
  
  <pre><code>handleStop() {
      this.setState({playing: false})
  }
  </code></pre>
  
  <p>And this works as well.</p>
  
  <p>The issue, however, is that once I navigate to a different route, the audio (and presumably the video) remains playing in the background. Actually, let me rephrase, the audio <strong>restarts</strong> in the background when I change routes.</p>
  
  <p>After reading <a href="https://github.com/reactjs/react-router/blob/master/docs/guides/ComponentLifecycle.md" rel="nofollow">this page from the react-router docs</a>, I have tried to include logic to call <code>handleStop</code> in various lifecycle events, yet none of them does the trick. So far, I have tried putting calls to <code>handleStop</code> in <code>componentWillReceiveProps</code>, <code>componentWillUpdate</code>, <code>componentDidUpdate</code> and <code>componentWillUnmount</code>.</p>
  
  <p>The closest I got was putting the call in <code>componentWillUnmount</code>, but I always receive an error about setting the state of an unmounted component (which doesn't make sense either, if this is called <em>before</em> unmounting?).</p>
  
  <p>So, by any chance, does anybody know where to put my call to handleStop?</p>
  
  <p>Thanks in advance.</p>