我刚在React Router Dom Docs v6中读到这个解决方案：

import { useNavigate } from 'react-router-dom';
...
const navigate = useNavigate();
...
<Button onClick={() => navigate('../user', { replace: true })}>Register</Button>

因此，基本上我在路由和replace: true之前添加了../。

• 参考：* https://reactrouter.com/en/6.9.0/hooks/use-navigate

这对我有用，希望对你有用

可行的解决方案！

navigate('/url')
navigate(0)

替换url后，手动调用navigate(0)将自动刷新页面！
这在从/same_path/foo导航到/same_path/bar的情况下有效。

请注意意外的页面引用刷新行为：

在正常情况下，比如从/home导航到/same_path/bar，navigate(0)会导致页面刷新，即使页面已经完成渲染。为了防止这种情况，你可以看看this question。

更多信息：

1. useNavigate docs
2. How do I reload a page with react-router?

尝试替换URL而不是添加新URL。当您从/dashboard/clients转到/dashboard/clients/foo时，您将从父级转到子级，您的URL包含所有内容以及/foo。但是，当您从/dashboard/clients/foo转到/dashboard/clients/bar时，您正在导航到可能导致问题的同级/foo到/bar。尝试到replace这值象navigate(/dashboard/clients/ba, {replace: true})这里是范例到如何到使用这一般.使用它为更多信息. https://www.digitalocean.com/community/tutorials/react-react-router-v6

我遇到了同样的问题，我的代码很好，但是，我在这篇文章中发现v6不支持可选参数。
https://github.com/remix-run/react-router/issues/7285
我有：

<Routes>
  <Route path="list/:id?" element={<SystemList />} />
</Routes>

不得不将其更改为：

<Routes>
  <Route path="list/:id" element={<SystemList />} />
  <Route path="list/" element={<SystemList />} />
</Routes>

我希望他们在未来支持它，但截至v6.0.2，他们不支持。

也许可以尝试组件导航：

<Navigate to={<your_path>}/>

这可能有点晚了，但我遇到了同样的问题，你只需要为你的组件触发一个re-render，你可以通过在你的组件中添加一个useEffect钩子来实现，你已经为/dashboard/clients/:clientId分配了一个依赖于你想要更新的参数的钩子。
它应该看起来像这样：

import React, { useEffect } from 'react'
import { useParams, useNavigate } from 'react-router-dom';

const ClientDashboard = () => {

    const params = useParams()
    const navigate = useNavigate()

    useEffect(() => {
    //do something with new id 
    },[params.clientId])

    const handleNavigate = (clientId) => {
        navigate(`/dashboard/clients/${clientId}`)
    }

    .....
}

您的页面现在应该会更新为新的参数

我认为这是一个更好的解决办法。

import React from 'react' 
import { useHistory } from 'react-router-dom' 
... 

const history = useHistory() 
const handleNavigate = (clientId) => {
        console.log(clientId)
        history.push(`/dashboard/clients/${clientId}`)
    }

确保您的应用程序从react-router-dom打包到BrowserRouter中

尝试将窗口位置作为关键 prop 添加到路径中的元素
即

<Route path=":id" element={ <Hello key={window.location.pathname} } />

基于此链接https://github.com/remix-run/react-router/issues/8245我可以解决这个问题。
我猜由于没有任何更改，屏幕没有更新。我一在目标路线组件上添加UseEffect，并将lastelement作为参数传递，它就工作了。
换句话说：在目标组件上添加：React使用效果（....）[最后一个元素]。