Skip to content

Commit 2b442d1

Browse files
committed
docs(react-router): working on v9 migration docs for react router
1 parent 1307564 commit 2b442d1

File tree

5 files changed

+161
-188
lines changed

5 files changed

+161
-188
lines changed

docs/react/add-to-existing.md

Lines changed: 4 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -300,23 +300,16 @@ Then, create `src/pages/Home.css`:
300300

301301
#### 5. Set up Routing
302302

303-
:::important
304-
305-
Ionic React Router currently only supports React Router v5. You must install the following specific versions of the router packages to set up routing with Ionic React.
306-
307-
:::
308-
309303
Install the router packages:
310304

311305
```bash
312-
npm install @ionic/react-router react-router@5 react-router-dom@5
313-
npm install @types/react-router-dom --save-dev
306+
npm install @ionic/react-router react-router react-router-dom
314307
```
315308

316309
Then, update `src/App.tsx` to add the routes for the Home page:
317310

318311
```tsx title="src/App.tsx"
319-
import { Redirect, Route } from 'react-router-dom';
312+
import { Route, Navigate } from 'react-router-dom';
320313
import { IonApp, IonRouterOutlet, setupIonicReact } from '@ionic/react';
321314
import { IonReactRouter } from '@ionic/react-router';
322315
import Home from './pages/Home';
@@ -329,12 +322,8 @@ const App: React.FC = () => (
329322
<IonApp>
330323
<IonReactRouter>
331324
<IonRouterOutlet>
332-
<Route exact path="/home">
333-
<Home />
334-
</Route>
335-
<Route exact path="/">
336-
<Redirect to="/home" />
337-
</Route>
325+
<Route path="/home" element={<Home />} />
326+
<Route path="/" element={<Navigate to="/home" replace />} />
338327
</IonRouterOutlet>
339328
</IonReactRouter>
340329
</IonApp>

0 commit comments

Comments
 (0)