React Router Link的动态参数不在props.match中

Question

我正在尝试建立一个小型博客网站。当从帖子的详细页面导航到作者的个人资料时，我将用户的ID传递给链接。

<Link to={"/userPage/" + this.state.post.userId}>{this.state.post.userName}</Link>

路线看起来像这样：

<Route path="/userPage/:id" exact component={UserPage}/>

这一切都很好。 但是，在我的导航栏中，我有一个＆＃39;我的个人资料＆＃39;链接，看起来像这样（登录用户的详细信息也存储在浏览器的本地存储中）：

<Link to={"/userPage/" + JSON.parse(localStorage.getItem('user')).id}>My Profile</button>

如果我目前使用的是其他用户的个人资料页面，并且想要从导航栏导航到我自己的个人资料页面，则浏览器的网址栏会显示正确的链接（使用我的用户ID） ），但是当我查看this.props.match.params.id时，它仍然包含之前用户的ID，直到我点击“我的个人资料”。链接第二次。谁能告诉我为什么会这样，以及我如何同步这些事件？感谢。

Answer 1

我终于找到了解决方案，我使用过早的生命周期方法从道具中获取参数并更新页面（componentWillUpdate）。使用componentDidUpdate时，顾名思义，组件的详细信息已经更新，我可以获取新的道具（并相应地获取数据）。