When im using svelte-kits routing system, I can create dynamics pages using [page].svelte for example, that will be rendered when I'm calling localhost:3000/foo. However when I'm navigating from localhost:3000/foo to localhost:3000/bar, the onMount() function is not called (I guess for performance reasons).
I can work around this issue by wrapping all relevant stuff in a {#key ... } expression, but is there any way to "remount" the page?
Thenks for helping me out :)
The onMount is not called, but the props are being updated.
This allows the new data to flow to the existing dom elements and the browser doesn't have to regenerate an entirely new page/component.
If there is state calculated based on these props, make sure that those are inside reactive statements and not just inside the onMount.
In some situation (with third-party code) it's more convenient to remount the component, and in those cases you'll use the {#key} block you mentioned.
pagechanges, you can put all these actions inside a function and call that function whenpageupdates with a reactive statement that is dependent onpage, for example:$: doRefresh(page). - Thomas Hennescanvaselement was not fully removed, leading to performance issues. There it seemed easier to just fully 'remount' the page. - derschiw{#key}would indeed be the right choice. - Thomas Hennes