React router не работает корректно

Пробую создать переход между страницами с помощью react-router. Пробую сделать все на отдельных страницах. Ошибки не показывает, ссылку формируется, но переход не происходит. Что я делаю не так?

Header.js

import React from "react";
import {BrowserRouter as Router, Switch, Route, Link} from "react-router-dom";
import {Home_Page} from "../All_Pages/Home_Page";
import {Pizza_Page} from "../All_Pages/Pizza_Page";
import {Sushi_Page} from "../All_Pages/Sushi_Page";

export let Header = () => {
return (
    <Router>
        <header>
            <Link to ="/">Home</Link>
            <Link to ="/pizza">Піца</Link>
            <Link to ="/sushi">Суші</Link>
        </header>

        <Switch>
            <Route path="/">
                <Home_Page/>
            </Route>
            <Route path="/pizza">
                <Pizza_Page/>
            </Route>
            <Route path="/sushi">
                <Sushi_Page/>
            </Route>
        </Switch>
</Router>
)
}

Sushi_Page.js

import React from "react";

export let Sushi_Page = () => {
return (<div>
    <h1>Sushi Page</h1>
        </div>)
}

App.js

import './App.css';
import {Header} from "./Header/Header";

function App() {
return (
<div><Header/></div> ); }
export default App;