navigate( routeUri ) does not work

This issue has been tracked since 2021-10-04.

App.svelte:

<script>
  import { Router, Route, Link, navigate } from 'svelte-routing';
  import Login from './pages/Login.svelte'; // login form - tested without routing, works
  import ContestList from './pages/ContestList.svelte'; // general list component - also tested before
  import Home from './pages/Home.svelte' ; // dummy home page
  export let url='' ;
  
</script>

<Router url="{url}">
  <h1>Hamtest Contest Manager</h1>
  <nav>
    <Link to="/contest/list">Show contest list</Link>
    <Link to="/login">Login</Link>
  </nav>
  <div>
    <Route path="/" component={Home} />
    <Route path="/contest/list" component={ContestList} />
    <Route path="/login" component={Login} />
  </div>
</Router>

Home.svelte:

<script lang="ts">
import { navigate } from "svelte-routing"

$: navigate('/contest/list', {replace: true })
</script>

<div>
<h3>HOME</h3>
</div>

How it works (server runs at port 8888):

  1. after load, renders component Home (shows H3 and the HOME text)
  2. URL in browser address/search box changes to http://localhost:8888/contest/list - that would be correct
  3. but the ContestList component does not render.
  4. Both the ContestList and Login will render when clicked on their respective link, but neither of them will render navigate() calls which respond to certain events: Login should switch to ContestList after the user is successfully logged in, ContestList should switch to Login if the user is not logged in.
    The above example should reproduce the error with anything used as Login and ContestList components, though.
mamolli wrote this answer on 2022-01-12

Was this addressed? I am also struggling with this.

ysomad wrote this answer on 2022-01-20

Same problem. Any solutions for this one?

airwalk741 wrote this answer on 2022-04-25

I am having the same problem.
Temporarily using the code below

  onMount(() => {
    if (accessToken !== null) {
      storeUser.update((user) => {
        return { ...user, isLogin: true };
      });
    } else {
      navigate("/login");
    }
  });
More Details About Repo
Owner Name EmilTholin
Repo Name svelte-routing
Full Name EmilTholin/svelte-routing
Language JavaScript
Created Date 2017-11-28
Updated Date 2022-12-03
Star Count 1711
Watcher Count 21
Fork Count 151
Issue Count 59

YOU MAY BE INTERESTED

Issue Title Created Date Updated Date