Где ошибка в react router dom?

Question

[Дарья ннн]

когда нажимаю на two открывается главная страница, а должен открываться компонент TwoP
index js

import React from 'react';
import ReactDOM from 'react-dom/client';
import App from './App';
import reportWebVitals from './reportWebVitals';
import { BrowserRouter } from "react-router-dom";

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
  <BrowserRouter>
    <React.StrictMode>
      <App />
    </React.StrictMode>
  </BrowserRouter>,
);

reportWebVitals();

Header jsx

import React from "react";
import {
  Link,
  Route,
  createBrowserRouter,
  createRoutesFromElements,
} from "react-router-dom";
import TwoP from "./Pages/TwoP/TwoP";

const Header = () => {
  const router = createBrowserRouter(
    createRoutesFromElements(
      
        <Route
          path="/two"
          element={<TwoP />}
        />

    )
  );
  return (
    <Link route={router} to="/two">
      two
    </Link>
  );
};

export default Header;

TwoP jsx

import React from 'react'

const TwoP = () => {
  return (
    <h1>TwoP</h1>
  )
}

export default TwoP

Comments

[szQocks]

2 ошибки,
1 - провайдер должен быть другой, не BrowserRouter а RouterProvider
2 - у тебя нет главной страницы вообще

И желательно - всё приложение оборачивать внутрь строгого режима

<React.StrictMode>
     <RouterProvider router={router}>
       <App />
     </RouterProvider>
</React.StrictMode>