"Error: Text content does not match server-rendered HTML"
I'm using the T3 template with Tailwind and tRPC. I'm not sure what I might've changed but it's still using the prefetch pattern with <HydrateClient> in the main server component and useSuspenseQuery() in the nested client component. My code is identical to the template with the exception of some extra form fields and a list.
While the data is loading in (a list of db entries) - an old set of data flashes in briefly. I'm assuming this is cached data and the rendered difference between that cached data and the new data is causing the error.
Assuming I just need to set no-cache somewhere, not sure how to do this with tRPC.
...any advice?
(another related question - if I wanted to render the list in the root/parent server component, and revalidate the list on submit in the nested client component - is this possible? Revalidating using utils in the client component does nothing.)
(also, do I need to wrap every page in <HydrateClient> and use void x.prefetch()? It's kind of an eye sore, and I can't find much documentation on usage.)
Thank you!!
While the data is loading in (a list of db entries) - an old set of data flashes in briefly. I'm assuming this is cached data and the rendered difference between that cached data and the new data is causing the error.
Assuming I just need to set no-cache somewhere, not sure how to do this with tRPC.
...any advice?
(another related question - if I wanted to render the list in the root/parent server component, and revalidate the list on submit in the nested client component - is this possible? Revalidating using utils in the client component does nothing.)
(also, do I need to wrap every page in <HydrateClient> and use void x.prefetch()? It's kind of an eye sore, and I can't find much documentation on usage.)
Thank you!!
