Search code examples
sveltesapper

How to link relative to current page in svelte/sapper component?


I've got a component in the sapper template with pagination. Currently all links are behaving as though they're relative to root (localhost:3000/ in this case) regardless of whether the href is in the form page or /page, (I even tried ./page.)

So for pagination where I just want to modify the query string I've got to pass the full path to the current view into the component for the href, which is a bit of a pain. Is there something I'm doing wrong that relative links aren't working? (Even better if there's a way to make them work calling goto() directly, I've got a "Goto page: [x]" input.) If not is there a recommended way to get the current path from inside a component so I can throw that in the pagination component?


Solution

  • Currently, Sapper doesn't support relative links.

    The best way to get current path would be to use window.location.href, which is only available once component is mounted.

    This is a known issue ("Update to reflect current route?") that was moved to "In Discussion / RFC Proposal" on 4th May 2020:

    "At present, is the same for all pages, which means you can't use relative URLs. This was introduced for good reasons, but it turns out to cause problems."