6

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?

Improve this question

2 Answers 2

Reset to default
3

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."

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

0

a workaround actually is possible, if your page is for example is http://localhost:3000/product/foo normally in your foo.svelte file the link to local page should like this:

<a href="#anchor"> link to same page </a>

but in sapper you have to put the page full path:

 <a href="product/foo#anchor"> link to same page </a>

tested on: "sapper": "^0.28.10", "svelte": "^3.29.4"

Improve this answer

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.