React Router Dom - React Router 更改 url 但不更改页面

我正在尝试使用反应制作一个简单的路由系统，但是当我单击链接导航到另一个页面时，它只是更改了 URL，但不显示内容，然后当我按 F5 时，它显示一切正常。

这是我的代码，我不明白我做错了什么，我也尝试创建另一个应用程序，但结果是一样的。

索引.js

import ReactDOM from "react-dom/client";
import App from "./App";

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

应用程序.js

import "./App.css";
import { BrowserRouter as Router, Switch, Route } from "react-router-dom";
import Dashboard from "./pages/Dashboard/Dashboard";
import Notes from "./pages/Notes/Notes";

function App() {
  return (
    <Router>
      <Switch>
        <Route path="/" component={Dashboard} exact />
        <Route path="/notes" component={Notes} />
      </Switch>
    </Router>
  );
}

export default App;

仪表盘

import PageContent from "../../components/PageContent/PageContent";
import ResponsiveDrawer from "../../components/ResponsiveDrawer/ResponsiveDrawer";

import { Link } from "react-router-dom";

const Dashboard = () => {
  return (
    <>
      <ResponsiveDrawer>
        <PageContent
          header={
            <div className={`flex-row`}>
              <h1
                className={`font-extrabold tracking-tight truncate capitalize`}
              >
                dashboard
              </h1>
            </div>
          }
          body={<>Bentornato utente!</>}
        ></PageContent>
      </ResponsiveDrawer>
    </>
  );
};

export default Dashboard;