title: Passing an object as prop in React-router Link
body: <p>I'm getting the list of products in <code>ProductList</code>, in which, I need to pass the selected product object to <code>Product</code>. </p>
  
  <p>Currently, I'm trying pass the <code>id</code> as a route param and get the product object again. But I want to send the entire product object from <code>ProductList</code> to <code>Product</code>.</p>
  
  <p>My Route is </p>
  
  <pre><code>&lt;Route path={joinPath(["/product", ":id?"])} component={Product} /&gt;
  </code></pre>
  
  <p>ProductList component Link</p>
  
  <pre><code>&lt;Link to={"/product/" + this.props.product.Id} &gt;{this.props.product.Name} &lt;/Link&gt;
  </code></pre>
  
  <p>How to pass product object to <code>Product</code> as a prop? </p>
  
  <p>the below one throws error in Typescript saying the following property does not exist on <code>Link</code> Type.</p>
  
  <pre><code>&lt;Link to={"/product/" + this.props.product.Id} params={product}&gt;{Name}&lt;/Link&gt;
  </code></pre>
  
  <p>I tried the following questions, but none seems to have my issues.</p>
  
  <ul>
  <li><a href="https://stackoverflow.com/questions/30115324/pass-props-in-link-react-router#30115524">Pass props in Link react-router</a>
  <code>&lt;--- this is similar to my issue, but answer doesn't work for react-router v4</code></li>
  <li><a href="https://stackoverflow.com/questions/27864720/react-router-pass-props-to-handler-component">react-router - pass props to handler component</a></li>
  <li><a href="https://stackoverflow.com/questions/44748547/react-passing-in-properties">React: passing in properties</a></li>
  </ul>