Parker Codes
Get array of matched nested routes
I'm using
@solid/router and would like to create a way to build breadcrumbs based on the nested routes I'm in, similar to useMatches() in Remix. Even if it just returned the simple array of matched routes, I could assign a key to each route and find a simple way to get a title and icon from there for breadcrumbs. I've searched through GitHub and here in Discord to find previous conversations and none of them seemed to find a solution, or at least didn't check back in to share.
Has anyone done this or have good ideas of where to start building from scratch?
Here's an alternate solution, but I don't want to get into portals and pushing to the array from the routes themselves: https://stackblitz.com/edit/solidjs-templates-wwykia?file=src%2Froutes%2Fone%2Ftwo%2Fthree.tsx
Remix's useMatches(): https://remix.run/docs/en/1.19.3/hooks/use-matches
Could utilize RouteDefinition .info: https://github.com/solidjs/solid-start/discussions/537#discussioncomment-88337828 replies
Scope styles to a page
Heyo! I want to be able to scope some CSS to only apply when that page component is mounted. This CSS targets the
html and body tags and is not for the component itself.
Currently I am doing import "./layout.css";, which correctly applies the styles when on this page, but then the styles remain in effect when I navigate to other pages.
I could use :has() but support isn't all the way there yet. I could utilize mount and cleanup, but not sure how I could "run" and dispose of the CSS because that's not how CSS works.8 replies