Svelte dynamic routing: passing extra parameters with goto

user_11072369 0
Viewed 39

The end goal is to be able to use the item name in the URL and pass the id to the component.

Currently, I'm using a table that shows a list of items. When the user clicks on a row, it will go to the details page of that item.

    function toDetailsRoute(id, name) {
        goto(`/clients/details/${name}`);
        // somehow pass the id to the component without placing it in the url
    }

This will use the details/[item].svelte component where the onMount lifecycle will use a GET request that takes the id as the parameter. I don't want to use the id in the URL because it's a Guid and looks massive.

The other option would be to generate a client facing ID on the backend when creating the item that the front-end can use. But I want to make sure that there is no other way to pass the id to the component first before attempting that.

sveltekit dynamic-routing svelte javascript
1 Answers

This is a bad idea, as it breaks URL navigation.

  • Refreshing the page will no longer work without workarounds
  • The page cannot be bookmarked or shared with other people

If you really want to do this anyway, you could set the ID in a cookie, for example. The route would no longer trigger, so the file would have to be renamed.

user_5467300
Related