react-router-dom 链接不会将用户推送到新链接

Question

我有一个路径为“/contacts/:userIds”的路由

                <Route
                  exact
                  path="/contacts/:usersIds"
                  component={contacts}
                />

我有一个问题，如果用户在页面 /contacts/123 上，然后点击不同的链接组件，如 contacts/234，然后点击浏览器链接更改，但页面保持不变，因为用户仍将在页面 /contacts/123 上，而不是在 /contacts/234 上。

这是简化的代码，它是 ListItems 的映射，带有来自“react-router-dom”的 Link 组件：

                     <ListItem
                        key={key}
                        button
                        component={Link}
                        to={
                          `/contacts/` +
                          (user1_user2)
                        }
                      >

Answer 1

你可以在你的函数中添加一个 useEffect 和 props.location.pathname 依赖，只要 URL 发生变化就会执行。

  useEffect( () => {
   console.log(newUrl, props.location.pathname)
}, [props.location.pathname] )