T
TanStack•14mo ago
multiple-amethyst

Nested routes with folders in file based routing

I'm using tanstack router for a current project. I've got an issue. Given the sample pseudo routing structure: 
/_authenticated - folder + a separate layout 
  /member - this needs to have a "layout" with 4 nested routes
      appearance.tsx
      settings.tsx
      profile.tsx
      orders.tsx
      index.tsx - This is the main view with an <Outlet /> inside it
/_authenticated - folder + a separate layout 
  /member - this needs to have a "layout" with 4 nested routes
      appearance.tsx
      settings.tsx
      profile.tsx
      orders.tsx
      index.tsx - This is the main view with an <Outlet /> inside it
I'm currently using this structure and when I'm on /members and click on orders instead of orders appearing inside the index.tsx, they are a separate route. I've tried adding .route.tsx at the end and it didnt work. Am I missing something?
2 Replies
wise-white
wise-white•14mo ago
index.tsx is a distinct route. Your <Outlet> should probably go in /_authenticated/member.tsx. Its hierachy is something like this. 
member.tsx
member/
  index.tsx
  settings.tsx
member.tsx
member/
  index.tsx
  settings.tsx
It can also, be represented as 
member/
  route.tsx 👈🏼 same as the member.tsx from above
  index.tsx
  settings.tsx
member/
  route.tsx 👈🏼 same as the member.tsx from above
  index.tsx
  settings.tsx
multiple-amethyst
multiple-amethystOP•14mo ago
Thanks for the help!

Did you find this page helpful?