TanStackT
TanStack2mo ago
8 replies
faint-white

Dynamic title fails to set on 1st client-side navigation: `loaderData` undefined

So here's a usual article/post route setup:
export const Route = createFileRoute('/article/$id')({
    loader: async ({ params, context }) => {
        console.log('Loader running for article:', params.id);
        const data = await context.queryClient.ensureQueryData(
            articleQy(params.id),
        );
        console.log('Loader data:', data);
        return data;
    },
    
    head: ({ loaderData }) => {
        console.log('Head function called with loaderData:', loaderData);
        return {
            meta: [{ title: pageTitle(loaderData?.title ?? 'Article title n/a') }],
        };
    },
    
    component: ArticleDetailPage,
});


When I first navigate to an article, from the article list page, the title fails to show; but if I revisit that same article for the second time, the title is set correctly.

Indeed, the
loader
function prints out valid data, but the
head
function prints that its loaderData is undefined!

Is this a known issue, or am I missing something?
Using Start 1.140.5 with Solid.
Thank you.
Was this page helpful?