Route Data to Pass Signal to Children Components
Hi. I'm trying to pass a signal from a great grandparent to a its great grand children.
In (home).jsx I have this:
const [selectedFont, setSelectedFont] = createSignal('inter')
export function routeData() {
return selectedFont()
}
In the great grand child I have this:
const font = useRouteData()
createEffect(() => {
console.log(font)
})
But font is never updated in the great grand child. The great grand child gets the original value(inter) but it doesn't appear to be updating. I've confirmed it's changing in (home).jsx. I also tried to using createRouteData() in (home).jsx
8 Replies
1. you shouldn't really use global signals in a SSR env. you are risking hydration mismatches and srate leaking on the server
2. your effect is not subscribing to anything, it doesn't read from a signal
is there someway to get a signal from (home).jsx to a file deep in the (home) folder?
preferably through context, this way you're making sure that each request will have it's own copy of the state
I also set up a context provider but I'm not sure which component I should wrap with the provider. Like with SolidJS I would wrap the <App /> component in the provider. I tried wrapping <FileRoutes /> in the provider but that didn't seem to be good.
don't wrap FileRoutes becuse it doesn't render anything
wrap <Router>
or <Routes> maybe
Dang... wrapped <Routes> and it works. Yesterday I tried wrapping <Outlet /> and a few other components too. I guess I could have kept guessing and would have eventually picked the right component.
I would guess that if you have an Outlet, wrapping it should also work 🤔
need to see how it works
In my case wrapping the <Outlet /> probably doesn't work because I'm using the provider in the component that <Outlet /> is in