0

我有一个 Link 路由器，可以将我从一个页面带到另一个页面，如下所示：

  <Link
  to={{
    pathname: `/details/${submission.id}`,
    state: { mySubmission: submission }
  }}>

此链接将我带到另一个称为详细信息的页面。我想传入我从链接开始到我的详细信息页面的页面创建的对象

我正在尝试获取存储在 mySubmission 中的信息，但我成功了，任何帮助将不胜感激

下面是我的详情页

class Details extends React.Component {
   componentDidMount() {
    const { match: { params } } = this.props;
  
    axios.get(`/details/${params.userId}`)
      .then(({ data: user }) => {
        console.log('user', user);
  
        this.setState({ user });
      });
  }
  //let currentSubmission;
  //var currentSubmission = props.location.state.mySubmission;
  //let var = this.props.location.state;

    render() {
        return (

    <React.Fragment> 
      <Carousel>
        <Carousel.Item>
          <img src={logo}  alt="logo"/>
        </Carousel.Item>
        <Carousel.Item>
          <img src={logo}  alt="logo"/>  
        </Carousel.Item>
        <Carousel.Item>
          <img src={logo}  alt="logo"/>
        </Carousel.Item>
      </Carousel>

        {/*Right now everything is hard coded but should be passed in as props in future */}
      <div className="card-body">
        <h1 className="title-event">{}</h1>
        <br></br>
        <h2 className="title-location">Kiev, Ukraine</h2>
        <br></br>
        <h1>{this.props.location.state}</h1> {/*not working */}

最后，我想在详细信息页面中显示对象的字段。

先感谢您！！！

PS：这是我获取状态属性的Link API，说我能够将对象传递给 Link

4

1 回答 1

0

我认为您需要包装您的组件withRouter才能正确接收状态。

然后你从props.location.state

检查此沙箱

于 2021-06-11T13:45:29.447 回答