TanStackT
TanStack•2y ago
dead-brown

How to get route context correctly typed?

Hi everyone,

could someone help me understand how match.routeContext gets its type? I was reading the documentation about "Processing Accumulated Route Context" and from my understanding the type should extend the Router Context defined in createRootRouteWithContext. But I get an error if I try to access the properties that I define in Router Context. Should I define the correct type somewhere else?

Edit: I made a codesandbox

This is my code:
// src/routes/__root.tsx
type RouterContext = {
  title?: string;
};
export const Route = createRootRouteWithContext<RouterContext>()({
  component: () => {
  const matches = useMatches();
  const matchWithTitle = [...matches]
    .reverse()
    .find((d) => d.routeContext.title !== undefined); // <---- Here I get the type error 
    // ...
  },
});
image.png
Was this page helpful?