I created a context system in SolidJS for forms
export const FormContext = createContext<Form>();
export interface Form {
data: any;
set: (data: any) => void;
validationResult: Accessor<Joi.ValidationResult<any> | undefined>;
touched: Accessor<TouchedData>;
setFieldValue: (field: string, value: string) => void;
inputChangeHandler: (name: string) => (e: Event) => void;
}
/* snip */
export default function FormContextProvider(props: FormContextProviderProps) {
/* set all of the form variable to apply to the context */
return (
<FormContext.Provider value={form}>
<form use:formDecorator>{children}</form>
</FormContext.Provider>
)
And in an input under that, I do:
const form = useContext(FormContext);
and the form value seems to be stuck at undefined. :(
More details here: https://stackoverflow.com/questions/76947570/solidjs-context-not-passing-down-to-children