[英]react router v6 redirect with params
I have the following code:我有以下代码:
<Route
path=":teamId"
element={<Navigate to=":teamId/league" replace />}
/>
<Route path=":teamId/*" element={<TeamsPage />} />
When a user comes to http:localhost:3000/liverpool
I want them to be redirected to http:localhost:3000/liverpool/league
but I see the following in the url当用户访问
http:localhost:3000/liverpool
我希望他们被重定向到http:localhost:3000/liverpool/league
但我在 url 中看到以下内容
http:localhost:3000/:teamId/league
http:localhost:3000/:teamId/league
Can anyone help?任何人都可以帮忙吗? I am already tearing my hair out with this upgrade from v5 -> v6.
从 v5 -> v6 升级,我已经把我的头发扯掉了。 I'm nearly there but it certainly hasn't been easy..
我快到了,但肯定不容易..
This should redirect to :teamId/league
:这应该重定向到
:teamId/league
:
<Route
path=":teamId"
element={<Navigate to="league" />}
/>
The forward slash in the to
attribute before league
is not needed. league
前的to
属性中的正斜杠是不需要的。
You are redirecting to the path string literal ":teamId/league"
instead of using a relative path or another template literal.您正在重定向到路径字符串文字
":teamId/league"
,而不是使用相对路径或其他模板文字。 This will, OFC, result in redirecting to "http:localhost:3000/:teamId/league"
. OFC 这将导致重定向到
"http:localhost:3000/:teamId/league"
。
A solution would be to use a layout route on path "/:teamId"
and use the index route to redirect to the nested "league"
route rendering the TeamsPage
component.一种解决方案是在路径
"/:teamId"
上使用布局路由,并使用索引路由重定向到呈现TeamsPage
组件的嵌套"league"
路由。
<Route path=":teamId">
<Route index element={<Navigate to="league" replace />} />
<Route path="league" element={<TeamsPage />} />
</Route>
Try this:尝试这个:
<Route path=':teamId/*' element={<TeamsPage />} />
<Route path=':teamId' element={<Navigate to='league' />} />
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.