Hydration Issue in Next JS

I have created a simple demo setup to showcase my issue. please find the sandbox link. please fork and use
https://codesandbox.io/p/devbox/test-xxhhfy
First, I am prefetching the user data in the

page.tsx

page.tsx

as instructed in https://tanstack.com/query/latest/docs/framework/react/guides/advanced-ssr. The initial render on the server works fine. The counter value is incremented when the user clicks on the like/dislike button. till here everything works fine but when I refresh the page, the initial rendered data is coming instead of the latest data after the user updates the value by clicking. Can you please tell me where I am making the mistake?

TanStack•14mo ago•

1 reply

ripe-gray

Hydration Issue in Next JS

I have created a simple demo setup to showcase my issue. please find the sandbox link. please fork and use
https://codesandbox.io/p/devbox/test-xxhhfy
First, I am prefetching the user data in the

page.tsx

page.tsx

Hydration Issue in Next JS

Similar Threads

Hydration Issue in Next JS

Similar Threads

Similar Threads

Similar Threads