Hi all, I'm currently facing a pretty straight forward problem, that I'm trying to solve for 2 days now.
I have a PageHeader component that displays a breadcrumb. The PageHeader is using a pinia store to fetch the breadcrumb config and render it. In every page I populate the breadrcrumb store with the data that should be displayed (I'm fetching async data with pinia colada):
When loading a page I'm getting hydration mismatch errors and the breadcrumb is initially empty and shows up only after a few milliseconds. So it flickers on page load. Also the async data in the breadcrumb is never shown as it is always undefined. On the page it shows without problems however.
I found a few posts and issues now, dealing with the same kind of problems (e.g. https://github.com/nuxt/nuxt/discussions/19424) but it does not seem that there is a good solution to this problem. I also tried to solve it by using
definePageMeta
definePageMeta
but it can't handle async data at all.
So any ssr friendly way to implement breadcrumbs with dynamic data?
Hello all, I've been dealing with a problem I just have for hours and have searched half the internet :) I would like to render a blog article on a page and put the breadcrumbs dynamically into...