Динамический параметр React Router Link отсутствует в props.match

Question

Я пытаюсь создать небольшой блог-сайт.При переходе от подробной страницы сообщения к профилю автора я передаю идентификатор пользователя по ссылке.

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

Маршрут выглядит следующим образом:

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

Все это прекрасно работает,Тем не менее, в моей панели навигации у меня есть ссылка «Мой профиль», которая выглядит следующим образом (данные вошедшего в систему пользователя также хранятся в локальном хранилище браузера):

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

Если я в данный момент включенстраница профиля другого пользователя и хотите перейти с панели навигации на страницу своего профиля, в строке URL браузера отображается правильная ссылка (с моим идентификатором пользователя), но когда я проверяю this.props.match.params.id, он по-прежнему имеетидентификатор предыдущего пользователя, пока я не нажму ссылку «Мой профиль» во второй раз.Может кто-нибудь сказать мне, почему это происходит и как я могу синхронизировать эти события?Благодаря.

Answer 1

Я наконец нашел решение, я использовал преждевременный метод жизненного цикла, чтобы получить параметр из реквизита и обновить страницу (componentWillUpdate). При использовании componentDidUpdate, как следует из названия, детали компонента уже были обновлены, и я могу получить новый реквизит (и соответственно получить данные).