Name parameter does not changes when changed in browser address bar

1. Setted route with named parameter in routes.js:

import Post from "./pages/post.svelte";
export const routes = new Map();
routes.set("/posts/:id", Post);

1. In Post component

<script>
export let params;
console.log(params.id);
</script>
{ params.id } 

For example if I click on link “/posts/123” right in webapp - it works well, but if I change this link to “/posts/5” in browser’s address bar - ‘params.id’ still lasts as “123”

[ItalyPaleAle]

I am not familiar with many other routers to this level so I can’t comment on their behavior fully. However, I don’t think this is about hash-based routing.

In Svelte 3, code inside the script block is executed only once, when the component is mounted the first time. To make code execute reactively, you can use the $: label.

Now, when you change page from /posts/123 to /posts/456, the component is the same. So, the router does not un-mount and re-mount the component. This means that the code in the script block is not re-executed, unless you make the statements reactive by binding them to props.

The fact that the component is not un-mounted is a design decision: it minimizes the amount of re-renderings and so it gives best performance. It’s also consistent with the patterns of Svelte 3 (which recommend re-rendering only what’s updated and encourages using reactive statements). You can find a discussion on the topic in #148

Closing this for now as it seems to be working as intended. But feel free to comment further.

[azakost]

Still feel that routes with named parameter should act like other routes without it.

This is rithorical issue. Anyway thanks for your job!