Setting parameters in LINK reactjs

I would like to pass information through the Link tag to another component . However , i am unable to after watching several tutorials .

function Productscard(props) {
  return (
   <div className="item">
      <Link to = "/products_info">
      <div className="item_container">
<h3 className="subcategory_Tag"> {props.subcategory}</h3>
<h2 className="name_tag"> {props.name}</h2>
<img src={photo} alt="" className="photo" />
<h3 className="price_tag">$399.99 - $500</h3>

</div>
</Link>



   </div>)
}

export default Productscard

There are several Productscard components being rendered on the page . Upon being clicked , they should take me to the products_info page and display product name and description . I have attempted unsuccessfully and below is my product_info component -

function Product_info(props) {
  const params = useParams();

  return (
 <div className="product_info">

<h1>
         {params.name} 
      </h1>



 </div>
  )
}

export default Product_info

I have also set the route in app js

          <Route path="/products_info element={<Product_info />}/>

I have tried the above code unsuccessfully