Is router.state.currentMatches supposed to return folder path and it's index?
i'am using file-based routing in this exmaple what usecase i need the "/dashboard/" still learning?
8 Replies
other-emeraldOP•3y ago
let me add context so my question is a little bit clear, i wanted to create breadcrumbs using
const router = useRouter() so when i call router.state.currentMatches gives an array one of the properties is the id my use case need only to get _root_ and /page why is it also give me /page/ and what is the use for it?rare-sapphire•3y ago
/page and /page/ are not the same thing
The latter is an index route match
If you'd like to disregard index route matches, you could filter them out
matches.filter(d => d.route.path !== '/')other-emeraldOP•3y ago
yes that's exactly what i thought its the index route thank you for the clarification it's amazing to be able to create a breadcrumbs component easily with
useRouter()rare-sapphire•3y ago
You might want to useMatches() instead.
It could be more efficient
continuing-cyan•12mo ago
Came here for this thread specifically! I'm scaffolding a new project, trying to use the useMatches() hook for breadcrumb items, and my index.tsx routes nested within folders are not working. Any ideas why? When I do dot-based, everything works as expected, but if i do:
__root.tsx
posts/
--index.tsx
--$postId.tsx
...if I navigate to /posts/123, I only get two matches, not three.
any ideas?
continuing-cyan•12mo ago
I've found that I can work around this, by having a route.tsx file, but all the docs point towards using index.tsx. is it an anti-pattern to use both? feel like I'm missing something 🙂
continuing-cyan•12mo ago
when i look at devtools, I'm assuming I would want my typical list > details convention to look more like how tasks is setup, than how posts is:
passive-yellow•12mo ago
you either need a posts.tsx next to posts/ or a route.tsx inside of posts/