Next.js Discord

Discord Forum

Link not updating instantly on click

Unanswered
Sun bear posted this in #help-forum
Open in Discord
Sun bearOP
I have this navigation column with Links like this:
<Link prefetch={false} href={getHref()}>
  Click me
</Link>


Now when I click the Link i expect the url to change instantly but it doesnt. It is basically similar to this example (Right side where the Relevance links are):
https://commerce-v1.vercel.store/search/designers/next.js/featured?sort=trending-desc
There when I click on a Link it updates the url instantly which means I see the Loading skeleton.

So I am not sure if I have some sort of setup issue? Basically I am struggling to get the loading skeleton to show instantly on Click of a Link in my setup and I think it is because the URL is not being updated instantly.
Any help is appreciated 🙂

8 Replies

Spectacled bear
Now when I click the Link i expect the url to change instantly but it doesnt.

@Sun bear What does this mean? Care to elaborate?
Sun bearOP
When I have a url like this /search/designers/next.js/featured?sort=trending-desc
And I click it, should the url in the browser bar be updated instantly?
or only change when the content is fully loaded?
because it seems to me when I click on a link on the right side here:
https://commerce-v1.vercel.store/search/designers/next.js/featured
(where it shows the Relevance filter), then the browser url is updated instantly and I see the loading skeleton
whereby in my setup which is basically the same, does not seem to work that way
Spectacled bear
Could you share the code of getHref()
Sun bearOP
Its very simple though

const getHref = () => {
    const root = `/applications`;

    if (state) {
      return `${root}?state=${state}`;
    }

    if (track) {
      return `${root}?tracks=${track}`;
    }

    if (score) {
      return `${root}?qs=${score}`;
    }

    return root;
  };
Spectacled bear
Can you share a sandbox to try out.