Question

我尝试使用Link传递状态数据，并且我已经阅读了一些有关此问题的文章，但不适用于我的代码。而且我仍在学习对反应的了解，并且我个人制作了这个项目

i在父路由中使用“ this.props.location.state”，但未定义。你能帮我找到解决这个问题的方法吗？

//此“我的应用”（主要）

<Router>
  <div className="App">
     <Navbar userData={this.state.userData}/>
        <div>
           <Switch>
             <Route exact path={'/'} component={home}/>
             <Route path={'/Profile'} component={profile}/>
             <Route path={'/Explore'} component={explore}/>
           </Switch>
       </div>
    </div>
 </Router>

// this在Navbar组件中，我正在使用链接

 <Link
     to={{
        pathname: "/Profile",
        state: { userId: this.state.userId }
        }}
  >
     <img alt=" " src={profile}/>
</Link>

当我在Apps处的console.log（this.props.location.state）始终未定义时，我尝试在“配置文件”中使用此链接传递数据概念并得到相同的结果

您能对此问题进行解释吗？谢谢

Answer 1

您不能通过state传递<Link />。

// In Route
 <Route path='/profile/:userId' component={Profile} />

// Profile.js
     <Link to={`/Profile/${this.state.userId}`}>
         <img alt=" " src={profile}/>
    </Link>
And read in 
  let userId = parseInt(props.match.params.userId, 10);

选中此https://knowbody.github.io/react-router-docs/api/Link.html

如何使用链接传递到父路线的状态以及如何访问它

1 个答案: