javascript - Typen '{ children: Element[]; }' saknar följande egenskaper från typen 'RouterProps': location, navigator

Försöker använda React Router V6 med TypeScript, men jag får ett typerrorsmeddelande på <Router />-komponenten när jag lägger till Routes inuti. Det står att children-egenskapen som skickas till Router inte är av rätt typ, trots att jag helt enkelt har använt de komponenter som biblioteket tillhandahåller.

Min kod:

import React from 'react';
import ReactDOM from 'react-dom/client';
import { BrowserRouter, Router, Route } from 'react-router-dom';

// Styles
import './css/index.css';

// Pages Directory
import * as Pages from './pages';

const root = ReactDOM.createRoot(
    document.getElementById('root') as HTMLElement
);

root.render(
    <React.StrictMode>
        <BrowserRouter>
            <Router>
                <Route path="/" element={<Pages.Home />} />
                <Route path="about" element={<Pages.About />} />
            </Router>
        </BrowserRouter>
    </React.StrictMode>
);

Fel :

ERROR in src/index.tsx:18:5
TS2739: Type '{ children: Element[]; }' is missing the following properties from type 'RouterProps': location, navigator
    16 |        <React.StrictMode>
    17 |                <BrowserRouter>
  > 18 |                        <Router>
       |                         ^^^^^^
    19 |                                <Route path="/" element={<Pages.Home />} />
    20 |                                <Route path="about" element={<Pages.About />} />
    21 |                        </Router>

Svar #1

Prova detta, du måste ändra Router till Routes, kolla på denna kod.

root.render(
<React.StrictMode>
    <BrowserRouter>
        <Routes>
            <Route path="/" element={<Pages.Home />} />
            <Route path="about" element={<Pages.About />} />
        </Routes>
    </BrowserRouter>
</React.StrictMode> ):

Relaterade artiklar