Route matching under multiple layout with file based is not under a parent route
Hello,
I have a quick question but I did not find the answer in the docs.
We are using file base routing with multiple layout that are nested, and routes likes
I have a
/settings with a navigate that goes to setting/generalso the user does not fall on a 404 page when going to the /settings page, so you have the context.
Is it normal that general and info routes are not under a settings parent route in the debugger like that ?
And is it normal that the settings route is not matched ?
If this is normal, how would you do a breadcrumb with this kind of situation ?
Thank you in advance for your answer
7 Replies
sunny-green•15mo ago
you don't have a settings route defined
so why would it appear?
you only have routes defined whose paths start with the
settings/ prefix
you can explicitly define the settings route by either addingal a settings.tsx next to the settings folder or a route.tsx inside the settings folderfascinating-indigoOP•15mo ago
Hello Manuel, thank you for the informations !
I missed the
route.tsx... I though you only needed index.tsx or index.lazy.tsx to handle everythingeastern-cyan•15mo ago
but route
route.tsx and index.lazy.tsx generate two routes setting/ and setting. which lead to data inside both routes is difference. what/how to make route.tsx behave same as index.tsx?eastern-cyan•15mo ago
StackBlitz
File Based Nested param routes (forked) - StackBlitz
Run official live example code for Router Basic File Based, created by Tanstack on StackBlitz
fascinating-indigoOP•15mo ago
You are asking me the question ?
eastern-cyan•15mo ago
@Thomas A. yeah (anyone). how you managed to get only one parent route
setting/ when using both route.tsx and index.tsx?relaxed-coral•14mo ago
What's the behavior when you define both a
route.tsx and a index.tsx file? I'm also trying to build a breadcrumb feature, but I'm not sure how to make it match a parent route and a child route while keeping the behavior of the index.tsx route. In other words, I'd like to keep the index route, but also define route.tsx file so that I can go back to this route if I'm in a child route. Is this possible to do?
Both the route.tsx and index.tsx render the same component and everything. Is that how I'm supposed to do it?
Ok I think I figured it out. You can just display the <Outlet /> component in route.tsx and the other routes can display your components.