Question on catch-all routing

Hey all, just trying to understand why this example does not work (I am trying to catch-all under a specific path /auth/* using redirectAuthRoute2):

export const authRoute = new Route({
  getParentRoute: () => rootRoute,
  path: "auth",
  component: () => {
    return <b>Auth</b>;
  },
});

// this works
export const redirectAuthRoute = new Route({
  getParentRoute: () => rootRoute,
  path: "auth/*",
  component: () => {
    return <Navigate to="/auth" />;
  },
});

// this doesn't work
export const redirectAuthRoute2 = new Route({
  getParentRoute: () => authRoute,
  path: "*",
  component: () => {
    return <Navigate to="/auth" />;
  },
});

export const authRoute = new Route({
  getParentRoute: () => rootRoute,
  path: "auth",
  component: () => {
    return <b>Auth</b>;
  },
});

// this works
export const redirectAuthRoute = new Route({
  getParentRoute: () => rootRoute,
  path: "auth/*",
  component: () => {
    return <Navigate to="/auth" />;
  },
});

// this doesn't work
export const redirectAuthRoute2 = new Route({
  getParentRoute: () => authRoute,
  path: "*",
  component: () => {
    return <Navigate to="/auth" />;
  },
});

Does this configuration not allow "redirectAuthRoute2" to inherit from /auth? or am I misunderstanding the documentation?

TanStack•3y ago•

1 reply

skinny-azure

Question on catch-all routing

Hey all, just trying to understand why this example does not work (I am trying to catch-all under a specific path /auth/* using redirectAuthRoute2):

export const authRoute = new Route({
  getParentRoute: () => rootRoute,
  path: "auth",
  component: () => {
    return <b>Auth</b>;
  },
});

// this works
export const redirectAuthRoute = new Route({
  getParentRoute: () => rootRoute,
  path: "auth/*",
  component: () => {
    return <Navigate to="/auth" />;
  },
});

// this doesn't work
export const redirectAuthRoute2 = new Route({
  getParentRoute: () => authRoute,
  path: "*",
  component: () => {
    return <Navigate to="/auth" />;
  },
});

export const authRoute = new Route({
  getParentRoute: () => rootRoute,
  path: "auth",
  component: () => {
    return <b>Auth</b>;
  },
});

// this works
export const redirectAuthRoute = new Route({
  getParentRoute: () => rootRoute,
  path: "auth/*",
  component: () => {
    return <Navigate to="/auth" />;
  },
});

// this doesn't work
export const redirectAuthRoute2 = new Route({
  getParentRoute: () => authRoute,
  path: "*",
  component: () => {
    return <Navigate to="/auth" />;
  },
});

Does this configuration not allow "redirectAuthRoute2" to inherit from /auth? or am I misunderstanding the documentation?

Question on catch-all routing

Similar Threads

Question on catch-all routing

Similar Threads

Similar Threads

Similar Threads