title: React Router with Path Params Not working
body: <p>I have a react BrowserRouter with the following configuration.</p>
  
  <pre><code>&lt;BrowserRouter&gt;
          &lt;div&gt;
              &lt;Switch&gt;
                  &lt;Route path={`/`} component={Home} exact/&gt;
                  &lt;Route path={`/about`} render={(props) =&gt; &lt;About {...props}/&gt;} exact/&gt;
                  &lt;Route path={`/products/:id/:slug`} render={(props) =&gt; &lt;Products {...props}/&gt;} exact/&gt;
              &lt;/Switch&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p>In the About Page there are products with the following  tag. If I click a link, the url changes and Product page is getting rendered correctly.</p>
  
  <pre><code>&lt;Link to={'/products/' + product.id + '/' + product.slug&gt;{product.name }&lt;/Link&gt;
  </code></pre>
  
  <p>But when I directly Land to Product page using the exact URL. rendering won't work.</p>
  
  <pre><code> e.g localhost:3000/products/123/books
  </code></pre>
  
  <p>Any idea what's causing the issue?</p>