您好,我正在尝试通过Details
React Router 的 Link 组件将 Props 传递给一个组件。我不想Detail
在页面上显示组件,它应该在单击按钮时呈现,而且当新组件呈现时,url 应该看起来像这样“/details/KvhNJecsqr6JFMSRTS”。
class Card extends Component {
render(props){
return(
<Col xs={12} md={4}>
<Thumbnail src="./someiamge">
<h3>{this.props.cardHeading}</h3>
<p>{this.props.cardDesc}</p>
<Button bsStyle="primary">Mieten</Button>
<Button bsStyle="default"><Link to='/details' params={{cardId: this.props.cardId}} 'here i wanna pass some props how i do this ?' >Details</Link></Button>
</Thumbnail>
</Col>
)
}
}
export default Card
这是我的路由器的东西
<BrowserRouter>
<div>
<Route name='details' path='/details/:cardId' component={Details}/>
</div>
</div>
</BrowserRouter>
hier 是我的Details
组件:
class Details extends Component {
render() {
return (
<div >
<div style={{textAlign: "left"}}>
<h3>{this.props.cardHeading}</h3>
<p>{this.props.cardDesc}</p>
.......
</div>
</div>
);
}
}
export default Details;