Navigation not instant with useRouter()
Answered
Spinge Bib Sqorpnts posted this in #help-forum
Hello! I am trying to redirect the client to a different page after a form has been submitted to an API, using
useRouter().push(), but the redirect is not instant.Answered by Spinge Bib Sqorpnts
After some trial and error I came to the conclusion that my data-fetching is flawed. @Clown @riský
I'm now using SWR and it works fine
I'm now using SWR and it works fine
28 Replies
I've tried both the production build and the dev environment on both
next@latest and next@canaryHas the browser download the page before .push?
As you can use prefetch to make sure it has
@riský As you can use prefetch to make sure it has
I tried prefetching too, but to no avail, but I'd rather just show the instant loading state, aka
loading.tsx.so prefetching with loading.tsx doesn't show loading instantly?
@riský so prefetching with loading.tsx doesn't show loading instantly?
nope. I have a loading.tsx in the
app/ directory and nested in the dynamic route too.thats odd because with next's link, it does do that (and router things are just what the link does)
@riský thats odd because with next's link, it does do that (and router things are just what the link does)
I've also just tried navigating with Link instead, same result.
and is this dev server (next dev) or production (next build && next start)
Related github issue, but I didn't find a fix...
https://github.com/vercel/next.js/issues/43548
https://github.com/vercel/next.js/issues/43548
and latest nextjs version
@riský and latest nextjs version
tried both canary and latest
well idk, it works well for me... must be something weird
sorry
@riský *sorry*
maybe its something with the way i fetch data?
I went with how the docs had stated: https://nextjs.org/docs/app/building-your-application/data-fetching/fetching-caching-and-revalidating
FetchData() is an async function with (currently) a set timeout in it to simulate an HTTP request that takes a bit
try not implmenting suspense youself
@riský try not implmenting suspense youself
tried that already
and just let nextjs do it with loading.tsx
o.O i really don't know then
tried using each and both
oh well, thanks anyways :D
Try providing a minimal reproducible repository
Even a sandbox works.
After some trial and error I came to the conclusion that my data-fetching is flawed. @Clown @riský
I'm now using SWR and it works fine
I'm now using SWR and it works fine
Answer