title: <Link> in Javascript / React-Router does not work properly
body: <p>I want to create a details page for the product.
  I have a page that shows all object(in http://localhost:3000/products/all)
  and my details page location is http://localhost:3000/product/headphons120/12/ (for example)
  and I use this code:</p>
  <pre><code>{products.map((product) =&gt; (
            &lt;Link
              key={product.id}
              to={`product/${product.slug}/${product.id}/`}
              className=&quot;p-link&quot;
            &gt;
              &lt;div className=&quot;product&quot;&gt;
                &lt;div className=&quot;cover&quot;&gt;
                  &lt;img src={`http://localhost:5000${product.photo}`} /&gt;
                &lt;/div&gt;
                &lt;div className=&quot;p-inform&quot;&gt;
                  &lt;span&gt;{product.name}&lt;/span&gt;
                  &lt;span&gt;{product.price}&lt;/span&gt;
                  &lt;span&gt;{product.point}&lt;/span&gt;
                &lt;/div&gt;
              &lt;/div&gt;
            &lt;/Link&gt;
          ))}
  </code></pre>
  <p>but in <code>all</code> page <code>product/${product.slug}/${product.id}/</code> addition to:
  http://localhost:3000/products/all</p>
  <p>and result: http://localhost:3000/products/product/T-shirt/9/</p>
  <p>I want to have http://localhost:3000/product/T-shirt/9/</p>
  <p>How can I fix it?</p>