good-rose

How to hide prefix when optional path param is undefined

react

this is in tanstack start, but posted under router since it seems more router related

Hey im currently following this

https://tanstack.com/router/v1/docs/framework/react/guide/path-params#with-prefix-and-suffix

my route looks like the following:

export const Route = createFileRoute(
    "/_sidebar/chat/f_{-$folderId}/c_{$chatId}",
)({
    component: RouteComponent,
});

export const Route = createFileRoute(
    "/_sidebar/chat/f_{-$folderId}/c_{$chatId}",
)({
    component: RouteComponent,
});

<Link
    to={`/chat/f_{-$folderId}/c_{$chatId}`}
    params={{ chatId: chat.id }}
>
</Link>

<Link
    to={`/chat/f_{-$folderId}/c_{$chatId}`}
    params={{ chatId: chat.id }}
>
</Link>

clicking the link without the folder path results in

chat/f_/c_{CHAT_ID}

chat/f_/c_{CHAT_ID}

. Manually setting it to

chat/c_{CHAT_ID}

chat/c_{CHAT_ID}

works fine. Also removing the prefixes correctly results in

chat/{CHAT_ID}

chat/{CHAT_ID}

Path Params | TanStack Router React Docs

Path params are used to match a single segment (the text until the next /) and provide its value back to you as a named variable. They are defined by using the $ character prefix in the path, followed...

TanStack•4mo ago

good-rose

How to hide prefix when optional path param is undefined

react

export const Route = createFileRoute(
    "/_sidebar/chat/f_{-$folderId}/c_{$chatId}",
)({
    component: RouteComponent,
});

export const Route = createFileRoute(
    "/_sidebar/chat/f_{-$folderId}/c_{$chatId}",
)({
    component: RouteComponent,
});

<Link
    to={`/chat/f_{-$folderId}/c_{$chatId}`}
    params={{ chatId: chat.id }}
>
</Link>

<Link
    to={`/chat/f_{-$folderId}/c_{$chatId}`}
    params={{ chatId: chat.id }}
>
</Link>

clicking the link without the folder path results in

chat/f_/c_{CHAT_ID}

chat/f_/c_{CHAT_ID}

. Manually setting it to

chat/c_{CHAT_ID}

chat/c_{CHAT_ID}

works fine. Also removing the prefixes correctly results in

chat/{CHAT_ID}

chat/{CHAT_ID}

Path Params | TanStack Router React Docs

How to hide prefix when optional path param is undefined

Similar Threads

How to hide prefix when optional path param is undefined

Similar Threads

Similar Threads

Similar Threads