You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
3.[Upgrade to React Router v6](#upgrade-to-react-router-v6)
29
31
30
32
The following is a detailed breakdown of each step that should help you migrate quickly and with confidence to v6.
@@ -101,6 +103,36 @@ In summary, to upgrade from v4/5 to v5.1, you should:
101
103
- Replace any `<Route>`s that are not inside a `<Switch>` with `useRouteMatch`,
102
104
or wrap them in a `<Switch>`
103
105
106
+
### Remove `<Redirect>`s inside `<Switch>`
107
+
108
+
Remove any `<Redirect>` elements that are directly inside a `<Switch>`.
109
+
110
+
If you want to redirect on the initial render, you should move the redirect logic to your server (we [wrote more about this here](https://gist.github.com/mjackson/b5748add2795ce7448a366ae8f8ae3bb)).
111
+
112
+
If you want to redirect client-side, move your `<Redirect>` into a `<Route render>` prop.
Normal `<Redirect>` elements that are not inside a `<Switch>` are ok to remain. They will become `<Navigate>` elements in v6.
127
+
128
+
### Refactor custom `<Route>`s
129
+
130
+
Replace any elements inside a `<Switch>` that are not plain `<Route>` elements with a regular `<Route>`. This includes any `<PrivateRoute>`-style custom components.
131
+
132
+
You can [read more about the rationale behind this here](https://gist.github.com/mjackson/d54b40a094277b7afdd6b81f51a0393f), including some tips about how to use a `<Route render>` prop in v5 to achieve the same effect.
133
+
134
+
### Ship it!
135
+
104
136
Again, **once your app is upgraded to v5.1 you should test and deploy it**, and pick this guide back up when you're ready to continue.
0 commit comments