Waiting for context provider to load before rendering children
My context provider doesn't load before the children are rendered.
Therefore, the context is undefined when it is used. I've tried using suspense to fix this, but the same error persists
18 Replies
Moving the resource out of the provider fixes this somewhat, but then useServerContext doesn't return anything
The usual cause is destructing children in the context provider component
But I can only guess
how is the context provider setup? why would it render children before context?
This is the provider
This is where it is in the component tree
These are how it's used:
mm ok so this is not due to destructuring
the provider looks fine
so the issue is that
ctx
is undefined or ctx.user()
is undefined?ctx
I'll get the error
hmm
could you move the provider above
<Routes>
?Yep
2 Secs
It works :)
Thanks so much
Do you know why it doesn't work within Routes?
I'm just curious now
alright
so the reason might be that <FileRoutes> just returns a json structure - it doesn't render anything, just passes the cofiguration to <Routes> and the <Routes> is where the rendering happens, so your provider was executing before the pages, it was just providing the context to the wrong tree
ok
awesome
I'm curious if the devtools would show that 🤔
I thought that FileRoutes returned loads of Route elements
Like with a For component
But I guess not :)
yeah
that'd be interesting
yeah but it doesn't render them
the context provider uses the
children
helper to resolve all nested children to make sure they all are called under the provider
but if the <route> returns something like this:
it won't call that function
<Routes> calls it
and it doesn't have a provider over itoh, that's awesome
again, thanks for the help