How come calling router.refresh() only refreshes the page once?
Unanswered
English Angora posted this in #help-forum
English AngoraOP
e.g.
Clicking on this button refreshes the page once (i.e. you can see loading.tsx execute), but afterwards it doesn't refresh anything.
<Button
onClick={() => {
router.refresh();
}}
>
Click
</Button>Clicking on this button refreshes the page once (i.e. you can see loading.tsx execute), but afterwards it doesn't refresh anything.
12 Replies
@English Angora e.g.
<Button
onClick={() => {
router.refresh();
}}
>
Click
</Button>
Clicking on this button refreshes the page once (i.e. you can see loading.tsx execute), but afterwards it doesn't refresh anything.
the router also checks if there are state changes and only updates these state changes. It's different from doing
window.location.reload(). With the window function there are no check against the state and the page would reload normallyEnglish AngoraOP
I see... is there a way to force a reload using router.refresh then? I'm trying to show changes on a page after a user presses a button that writes some data to the a db, but the changes don't display even when i use revalidatePath (which was why i started looking into router.refresh in the first place)
@English Angora I see... is there a way to force a reload using router.refresh then? I'm trying to show changes on a page after a user presses a button that writes some data to the a db, but the changes don't display even when i use revalidatePath (which was why i started looking into router.refresh in the first place)
you can force a page reload using the window function. How ever that's not a good practice. You might want to push the state directly after update to your page
English AngoraOP
Sorry what do you mean by push state? Do you mean use something like useState to manage state on the client instead of passing it through server components?
Thanks for answering all my questions btw I appreciate it
@English Angora Sorry what do you mean by push state? Do you mean use something like useState to manage state on the client instead of passing it through server components?
yes, you can do that for example though a client component. You tried using revalidatTag?
English AngoraOP
Yep (alongside unstable_cache) but it didn't work as expected... I thought revalidateTag was always supposed to refresh the current page but it didnt
yea, normally that would happen 🤔
Do you use any other caches?
Do you use any other caches?
@English Angora I see... is there a way to force a reload using router.refresh then? I'm trying to show changes on a page after a user presses a button that writes some data to the a db, but the changes don't display even when i use revalidatePath (which was why i started looking into router.refresh in the first place)
you need to use a server action to update the db. normal api routes/route handlers won't work
@joulev you need to use a server action to update the db. normal api routes/route handlers won't work
is there a reason why that does not work?
@B33fb0n3 is there a reason why that does not work?
it does work but only after you reload the page
a browser reload