Why is this code not reactive?
I have a TextField component that passes down information via context. Picture shown below. I am using @felte/solid as my form library. I'm trying to set validationState based on if there is an error in that specific value, however the code (show below) is not reactive and I'm not totally sure why.
errors() is reactive and errors().scenarios seems to be reactive, and the div with the Errors: {errors().scenarios?.[i]?.name?.[0]} seems to work fine, so I can't totally understand why the validationState is not reacting at all? It also seems to update correctly on HMR so I'm a bit confused by this. I can add any more information if needed.
4 Replies
contextValue is reading the the value of validationState in the component body (which is not reactive). You'll need to make the validationState prop of contextValue to be a function
It's equivalent to prop destructuringAre you saying like this or something else? Because this also does not work.
No I meant the property itself needs to be a function
You can't read it there otherwise it won't be reactive because the component body isn't reactive. If it were, it would cause the whole component to rerender
Had to do a few other things to get the types working nicely but this worked, thanks