title: React doesn't reload component data on route param change or query change
body: <p>I have a "home" component with links, and when you click a link the product component is loaded with the product. I also have another component which is always visible, showing links to the "recently visited products".</p>
  
  <p>These links don't work when on a product page. The url updates when I click the link, and a render occurs, but the product component doesn't update with the new product.</p>
  
  <p>See this example:
  <a href="https://codesandbox.io/s/9y877loq1w" rel="noreferrer">Codesandbox example</a></p>
  
  <p>Here are the routes in index.js:</p>
  
  <pre><code>&lt;BrowserRouter&gt;
    &lt;div&gt;
      &lt;Route
        exact
        path="/"
        render={props =&gt; &lt;Home products={this.state.products} /&gt;}
      /&gt;
  
      &lt;Route path="/products/:product" render={props =&gt; &lt;Product {...props} /&gt;} /&gt;
  
      &lt;Route path="/" render={() =&gt; &lt;ProductHistory /&gt;} /&gt;
  
      &lt;Link to="/"&gt;to Home&lt;/Link&gt;
    &lt;/div&gt;
  &lt;/BrowserRouter&gt;;
  </code></pre>
  
  <p>The links in ProductHistory look like this:</p>
  
  <pre><code>&lt;Link to={`/products/${product.product_id}`}&gt; {product.name}&lt;/Link&gt;
  </code></pre>
  
  <p>So they match the <code>Route path="/products/:product"</code>.</p>
  
  <p>When I am on a product page and try to follow a ProductHistory link, the URL updates and a render occurs, but the component data doesn't change. In the Codesandbox example you can uncomment the alert in Product components render function to see that it renders when you follow the link, but nothing happens.</p>
  
  <p>I don't know what the problem is...Can you explain the problem and find a solution? That would be great!</p>