React Router work on reload, but not when clicking on a link

by

I would go through your components and make sure you have only one <Router> ... </Router>. Also — make sure you have a <Router>...</Router> There may be cases when you’d use more than one, but if you accidentally have nested routers (because you were hacking quickly and forgot to remove one when you were moving it around to all kinds of places 😉 – it could cause an issue.

I would try

import {
  BrowserRouter as Router,
}  from 'react-router-dom'

// Other Imports

...

return (
  <Router>
    <div className="index">
      <Nav /> <!-- In this component you have <Links> -->
      <div className="container">
        <Routes />
      </div>
    </div>
  </Router>
);

In your top most component (App.js).

More Related Contents:

  1. Detect Route Change with react-router
  2. Simple Conditional Routing in Reactjs
  3. Use history.push in action creator with react-router-v4?
  4. How to push to History in React Router v4?
  5. Programmatically navigating in React-Router v4
  6. Nesting Routes in react-router v4
  7. React Router v4 – How to get current route?
  8. Nested Routes not rendering with React Router v4
  9. React router, pass data when navigating programmatically?
  10. React Router 4 Nested Routes not rendering
  11. React router 4 does not update view on link, but does on refresh
  12. How to nest routes in React Router v4?
  13. Programmatically navigate using react router V4
  14. React-router-v6 access a url parameter
  15. react-router scroll to top on every transition
  16. react-router-dom v6 useNavigate passing value to another component
  17. React doesn’t reload component data on route param change or query change
  18. What is the best way to redirect a page using React Router? [closed]
  19. React Router Pass Param to Component
  20. How to stop /#/ in browser with react-router?
  21. react-router-dom useParams() inside class component
  22. How to reset TabNavigator when user logs out (from other screen)
  23. Stop useEffect from running on mount
  24. How do you programmatically update query params in react-router?
  25. Using React-Router with a layout page or multiple components per page
  26. onEnter not called in React-Router
  27. React Router: Cannot read property ‘pathname’ of undefined
  28. Page layout broken in React Router v6
  29. how to set initial state in redux
  30. How do I see state when logging to the console instead of Proxy object inside reducer action?

Leave a Comment