Skip to content

Support for static prefix on dynamic paths #707

Open
@FugiTech

Description

Describe the bug

Currently TanStack Router supports dynamic path segments in the form /$var/. However it is sometimes useful to have a static prefix (or suffix) that is used as part of the matching. For example youtube.com/@ChannelName.

This is a feature request for Router to support the form /prefix$var/ (or some other way of having a static prefix mixed with a dynamic variable). Optionally it would be nice to also support suffixes, perhaps in the form /prefix$var$suffix/?

Your Example Website or App

https://stackblitz.com/edit/tanstack-router-jwzga9?file=src%2Fmain.tsx

Steps to Reproduce the Bug or Issue

new Route({
  path: '/prefix$var',
  component: function User({ useParams }) {
    const params = useParams();
    return <div className="p-2">Hello {params.var}!</div>;
  },
});

This will not be recognized as a dynamic route and var will not be available in params

Expected behavior

var would be available in params

Screenshots or Videos

No response

Platform

N/A

Additional context

No response

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions