SolidJSS
SolidJSโ€ข16mo agoโ€ข
2 replies
lawftyg

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.
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.
SolidJS
Was this page helpful?