Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Route doesn't get rendered when calling `navigate()`

See original GitHub issue


<script lang="ts">
  import { Route, Router, navigate } from "svelte-routing";

  <button on:click={() => navigate("/")}>Home</button>
  <button on:click={() => navigate("/foo")}>Foo</button>
  <button on:click={() => navigate("/bar")}>Bar</button>
    <Route path="/foo">Foo</Route>
    <Route path="/bar">Bar</Route>


Here, the Route corresponding to the browser url at the time of page load is correctly rendered. When clicking any of the buttons, browser url changes, but the Router still renders the old Route. Hitting F5 or entering the url in browser address bar and hitting enter causes the Route to be rendered correctly.

Minimal repro:

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:6 (1 by maintainers)

github_iconTop GitHub Comments

itsfarseencommented, Apr 26, 2021

I went further down the rabbit hole and looks like this is a Vite dev server bug.

Closing 😃

marcus-wishescommented, Apr 26, 2021

Also using the globalHistory doesn’t work for me in Vite. When I attach a listener to react on route changes it never gets called. It works for me using Rollup. I was unable to yet figure out why.

Read more comments on GitHub >

github_iconTop Results From Across the Web

React router dom navigate method is not working properly
1 Answer 1 · useLocation hook to grab the current location user is attempting to access. · Outlet component for nested protected routes....
Read more >
Navigating without the navigation prop
If you're unsure if a navigator is rendered, you can call navigationRef.current.getRootState() , and it'll return a valid state object if any navigators...
Read more >
Programmatically navigate with React Router (and Hooks)
Let's get React Router setup, I'm importing components Hello and Goodbye to demonstrate how to handle navigating with hooks.
Read more >
Introduction to react-router-dom: setting up your first routes
React JS as a Single Page App library doesn't include built-in routing capabilities as Angular does; it needs a library called ...
Read more >
A Complete Guide to React Router: Everything You Need to ...
The mental model I use for Route is that it always has to render something – either its element prop if the path...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Post

No results found

github_iconTop Related Hashnode Post

No results found