import { BrowserRouter as Router, Route, Switch } from "react-router-dom";
import Nav from "./Nav";
import Home from "./Home";
import About from "./About";

export default function App() {
    return (
        <>
            <Router>
                <Nav />
                <Switch>
                    <Route path="/" component={Home} />

                    <Route path="/about" component={About} />
                </Switch>
            </Router>
        </>
    );
}

I am using react-router-dom in my project and I am facing unusual behavior. when I use Link to perform navigation, the URL changes but the component is not rendered. and if I try to refresh the page at that point the component gets loaded. ( react-router-dom v5.2.0 )

import { Link } from "react-router-dom";
export default function Nav() {
    return (
        <nav>
            <ul>
                <li>
                    <Link to="/">Home</Link>
                </li>
                <li>
                    <Link to="/about">About</Link>
                </li>
            </ul>
        </nav>
    );
}