title: React - the preferred way to perform an action when leaving page / changing route
body: <p>I'm writing a react app which uses <code>react-router-dom</code> for routing. For one of the routes I have to perform an action when the user leaves (perform api request &amp; stop the timer).
  I can do this either </p>
  
  <ol>
  <li>In the cleanup function returned by <code>useEffect</code> hook inside the component rendered for that route </li>
  </ol>
  
  <p>or</p>
  
  <ol start="2">
  <li>Attach to the router and detect the route changes. </li>
  </ol>
  
  <p>Which way is better? Or perhaps there's some other way?</p>