Estou com o seguinte problema: tenho uma listagem de produtos(componente: Products.js) e ao selecionar um, quero que apareça seu conteúdo no componente: Product.js
Estou usando Router e Link. Não consegui passar o props assim como passo no App. Como eu passo apenas o elemento selecionado?
App.js
<div className="container">
<Route path="/products/:productId" component={Product} />
<Route exact path="/" render={() => (
<Products products={this.state.products} />
)} />
</div>
Products.js
{ this.props.products.map((product) =>
<Link to={`/products/${product.id}`}>
<Row className="product" key={product.id}>
<Col md={1}>{product.id}</Col>
</Row>
</Link>
)}
Product.js
<div className="container">
<Link to="/">Back</Link>
<Row>
<strong>Product Id</strong>
</Row>
<Row>
{apresentar o valor do produto selecionado}
</Row>
</div>