Passing data from route to layout in solid-start
I have a group of pages with one parent layout (ie /menu/lunch, /menu/dinner, with the layout under menu.tsx). The layout has a tab bar listing each of the pages under /menu. The color of this tab bar should change depending on the current route. Therefore I would like to be able to specify the color in the
routeData of that route and read it from the layout but it appears this is not possible (and I can see why things would get confusing if this were the case). What is the best way to pass data from a route to its parent layout?8 Replies
Unknown User•3y ago
Message Not Public
Sign In & Join Server To View
Ah okay, so would this still work during SSR as long as I set the signal in the component body (as opposed to on mount)
Unknown User•3y ago
Message Not Public
Sign In & Join Server To View
Great! thank you!
Looks like this does not work when js is turned off. For example the html is delivered with the wrong color and then the color is changed on hydration
Unknown User•3y ago
Message Not Public
Sign In & Join Server To View
The code is private but here is a reproduction: https://github.com/nonphoto/solid-start-test
GitHub
GitHub - nonphoto/solid-start-test
Contribute to nonphoto/solid-start-test development by creating an account on GitHub.
Unknown User•3y ago
Message Not Public
Sign In & Join Server To View
Ah okay I see why this might not work on
Html I will try it inside of suspense. It would be great to be able to set a property directly on html though, sort of like how Meta and Title add things to the head no matter where they appear in the component tree
Quick update I tried this out on a component inside of Suspense/ErrorBoundary and still didn't have any luck with js disabled. My concern is users getting the wrong background color before js loads.