title: Appropriate place to dispatch action for fetching server data
body: <p>I'm new to React and I'm trying to figure out the best way to request information from the server based on the URL. I'm using Redux and React Router v4.</p>
  
  <p>Let's say I have a route <code>/foo/:id</code>, and a component <code>Foo</code> that will render something based on <code>id</code>. However <code>Foo</code> needs some server data related to <code>id</code> to do so. I believe the way to accomplish this would be to use <code>mapDispatchToProps</code> to create a function that takes <code>id</code> as input, does some async work, dispatches an action, and ultimately updates the redux state.</p>
  
  <p>My question is: where is the most appropriate place to invoke the dispatch? In this scenario, there's no form submission or button click to kick things off. Originally I was thinking of including a check for the <code>id</code> data in <code>render()</code> and fetching if it was not populated, but this felt wrong due to the side effects.</p>