Home > Blockchain >  react router v6 redirect with params
react router v6 redirect with params

Time:06-13

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/:teamId/league

Can anyone help? I am already tearing my hair out with this upgrade from v5 -> v6. I'm nearly there but it certainly hasn't been easy..

CodePudding user response:

This should redirect to :teamId/league:

<Route
   path=":teamId"
   element={<Navigate to="league" />}
/>

The forward slash in the to attribute before league is not needed.

CodePudding user response:

Try this:

<Route path=':teamId/*' element={<TeamsPage />} />
<Route path=':teamId' element={<Navigate to='league' />} />
  • Related