小编Ax0*_*x0n的帖子

如果替换路径中的最后一个元素,React Router v6 useNavigate() 不会导航

我有一个具有以下功能的反应组件

    const handleNavigate = (clientId) => {
        console.log(clientId)
        navigate(`/dashboard/clients/${clientId}`)
    }
Run Code Online (Sandbox Code Playgroud)

console.log() 显示了我想要附加以在导航功能中使用的 ID。
并且
浏览器中的 URL正在更新。

但页面没有变化。

这适用于从 导航/dashboard/clients/dashboard/clients/foo

但无法从 导航/dashboard/clients/foo/dashboard/clients/bar

clientId 像这样传递到卡中......

const CompanyCard = (props) => {
    const { client, showWatchlist, removeDisabled, showRemove, removeType } = props
...
}
Run Code Online (Sandbox Code Playgroud)

然后在卡里

                <CardActionArea
                    onClick={() => handleNavigate(client._id)}
                 ...
Run Code Online (Sandbox Code Playgroud)

有任何想法吗?
谢谢

更新

在阅读了 @redapollos 的建议后,我尝试了Outlet

useRoutes 方法...都不起作用。

import { useRoutes } from 'react-router-dom'

// then in the routes...

        { path: 'clientdetail/:id', element: …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs react-router-dom

20
推荐指数
2
解决办法
7万
查看次数

标签 统计

javascript ×1

react-router-dom ×1

reactjs ×1