将状态数据传递到产品详情页

Question

我有一个显示api中所有项目的项目显示组件。当我单击产品时，我想通过指向产品显示页面的链接传递状态，以便我可以仅查看我单击的产品的详细信息。以下是代码产品列表

            return <div key={item.id} className="col-md-6">
                <div className="listing">
                    <div className="listing-thumbnail">
                        <Link  to={{
                                pathname: `listingdetails/${item.id}`,
                                state:{
                                    items: this.state.items
                                }
                            }}><img src={ item.images[0]} alt="listing" /></Link>
                        <div className="listing-badges">``` please help

Answer 1

您可以使用“查询”。

<Link  to={{
  pathname: `listingdetails/${item.id}`,
  query:{
    items: this.state.items
  }
}}>

你可以这样使用它。

constructor(props) {
  super(props);
  this.state = {
    item: props.location.query.items
  }
}