issues with createContext and useContext
Hello,
The other day I was working on a context with a store. I'll be the first to admit I am new at solidjs and was mostly following the guides for how to set up a context. The documentation i followed had a default value and setter function that was being added in the createContext function: https://www.solidjs.com/examples/context
It's a function with an undefined return as in the example. I did this and then in the .Provider value={} passed a fully defined setter function akin to the one used there and the store accessor value. For some 2 hours I was ripping my hair out because no matter what I did updates were only effecting the page in which they were happening. And when navigating to a different page they would reset. Eventually I realised that defaultValue in createContext was overwriting the change whenever i would navigate out of a page, causing the values to revert to default and the setter function to become an undefined body. This doesn't seem to be the intended behavior?
I removed the defaultValue from createContext and things started working with persistent changes.
... or so I thought, I retried today, starting up vite again. I now have an empty createContext() function but upon entering a page where I use the context I get an "(intermediate value)() is undefined" error that crashes the page. This error persists until I make a hotreload by saving a file I'm working on in the project. Suddenly everything is working again.
It looks like I'm in a damned if you do, damned if you dont situation where the defaultValue will overwrite the context upon navigation, or the lack of a defaultValue will result in an error that makes it unusable.
you can find my code here:
https://gitlab.com/HappySmileySystems/kampdagenapp/-/tree/configs-flaten-to-array-of-stores?ref_type=heads
there are two branches, the one I linked and error-default-value-in-context-store. both of these work.
I appologize for the state of the code as I'm only proof of concepting atm.
SolidJS
Solid is a purely reactive library. It was designed from the ground up with a reactive core. It's influenced by reactive principles developed by previous libraries.
1 Reply
the context provider is in app.tsx, sorry I ran out of space in the original post
I have solved this issue, if anyone has this issue, the solution is to move all the provider and context code into a sparate file from the file in which it is beign used, at least away form app.tsx. I moved all the code a /components/context/configcontext.tsx and it works now.