将params从链接传递到组件 - react-router-dom

Question

我正在尝试构建一个用户信息显示的个人资料页面。

路由是 - localhost：3000 / profile /，我想阻止在网址中显示用户ID。

示例：而不是localhost：3000 / profile / 10，我只想查看localhost：3000 / profile /.

我目前使用第一种方法，但我的老板要求我改用第二种方法。

虽然，获取当前登录用户的ID非常简单。我的挑战是至少将列出的用户的id传递给配置文件组件。

我使用react-router-dom和redux。谢谢你的帮助

Answer 1

考虑到您可以从网址中删除用户ID，我将为您提供如何通过链接传入ID的答案。由于您使用的是react-router-dom，因此您只需将用户ID传递为：

<Link to={{
  pathname: '/profile',
  state: { id: userId }
}}>
  <button>Profile</button>
</Link> 

此处userId只传递您要传递给配置文件的用户ID，稍后在配置文件组件中，您可以将此ID设为this.props.location.state.id