How can i navigate to different path on click in svelte?

Question

Currently in having on:click | preventDefault="{() => showDetail({id})}" and in showDetail function i want to naviagte to particular id which in i am passing on click of button.

I tried regular javascript methodlocation.assign but this is reloading the page and destroying the purpose of SPA. Is there any way to navigate in svelte without reloading

Look here for a solution with SvelteKit: https://stackoverflow.com/questions/68187584/how-to-route-programmatically-in-sveltekit — Ulf Aslak, Oct 18 '21 at 11:53

score 4 · Accepted Answer · answered May 19 '20 at 11:01

4

You need a router. There are SPA routers (Single Page Application) and SSR router (Server Side Rendering).

You may try :

https://routify.dev/
https://github.com/EmilTholin/svelte-routing (server side)
https://github.com/jorgegorka/svelte-router (SPA, seems not active project)
https://github.com/ItalyPaleAle/svelte-spa-router (SPA. I recommend it)
http://visionmedia.github.io/page.js/
https://github.com/lukeed/navaid
https://github.com/TehShrike/abstract-state-router/

answered May 19 '20 at 11:01

JeffProd

3,088
1
19
38

No, you don't. Path-based routing is built-in. – reggie Feb 03 '22 at 10:59
Routing does not come with https://svelte.dev/docs . Do you mean it is with SvelteKit ? https://kit.svelte.dev/docs – JeffProd Feb 04 '22 at 11:37

How can i navigate to different path on click in svelte?

1 Answers1

Linked