T
TanStack•4mo ago
optimistic-gold

ParentRoute data sharing not working on Alpha

Trying to do the following 
// routes/folder/index.tsx
export const Route = createFileRoute({
  component: RouteComponent,
  loader: () => {
    return {
      title: "Title",
    };
  },
});

function RouteComponent() {
  const data = Route.useLoaderData();
  return <div>Hello "{data.title}"!</div>; // this works
}

// routes/folder/subpage.tsx
import { Route as ParentRoute } from "@/routes/folder/index";

export const Route = createFileRoute({
  component: RouteComponent,
});

function RouteComponent() {
  const data = ParentRoute.useLoaderData();
  return <div>Hello "{data.title}"!</div>;
}
// routes/folder/index.tsx
export const Route = createFileRoute({
  component: RouteComponent,
  loader: () => {
    return {
      title: "Title",
    };
  },
});

function RouteComponent() {
  const data = Route.useLoaderData();
  return <div>Hello "{data.title}"!</div>; // this works
}

// routes/folder/subpage.tsx
import { Route as ParentRoute } from "@/routes/folder/index";

export const Route = createFileRoute({
  component: RouteComponent,
});

function RouteComponent() {
  const data = ParentRoute.useLoaderData();
  return <div>Hello "{data.title}"!</div>;
}
On the subpage, I get: | Invariant failed: Could not find an active match from "/folder/" Versions: 
"@tanstack/react-router": "1.121.0-alpha.1",
"@tanstack/react-router-devtools": "1.121.0-alpha.1",
"@tanstack/react-router-with-query": "^1.114.3",
"@tanstack/react-start": "1.121.0-alpha.1",
"@tanstack/router-plugin": "^1.114.3",
"@tanstack/react-router": "1.121.0-alpha.1",
"@tanstack/react-router-devtools": "1.121.0-alpha.1",
"@tanstack/react-router-with-query": "^1.114.3",
"@tanstack/react-start": "1.121.0-alpha.1",
"@tanstack/router-plugin": "^1.114.3",
1 Reply
generous-apricot
generous-apricot•4mo ago
an index route is never a parent it's a leaf route

Did you find this page helpful?