Code based useParams hook works with pathless id prefixed to route.

My routing tree looks like the following:
RootRoute -> Pathless_Layout_Route -> Products -> ViewProductRoute.

When i use the useParam hook like this:

const params = useParams({from: "/products/$productId"});

const params = useParams({from: "/products/$productId"});

It will show an error saying that the invariant is not found. Even though when i remove

useParams

useParams

, the page does render.`

However when i prefix the route with the pathless layout route, it does work.

const params = useParams({from: "/ui_with_header/products/$productId"});

const params = useParams({from: "/ui_with_header/products/$productId"});

Did i miss something in the documentation? Or is this supposed to happen?

TanStack•6mo ago•

19 replies

dangerous-fuchsia

Code based useParams hook works with pathless id prefixed to route.

My routing tree looks like the following:
RootRoute -> Pathless_Layout_Route -> Products -> ViewProductRoute.

When i use the useParam hook like this:

const params = useParams({from: "/products/$productId"});

const params = useParams({from: "/products/$productId"});

It will show an error saying that the invariant is not found. Even though when i remove

useParams

useParams

, the page does render.`

However when i prefix the route with the pathless layout route, it does work.

const params = useParams({from: "/ui_with_header/products/$productId"});

const params = useParams({from: "/ui_with_header/products/$productId"});

Did i miss something in the documentation? Or is this supposed to happen?

Code based useParams hook works with pathless id prefixed to route.

Code based useParams hook works with pathless id prefixed to route.

Similar Threads