form-atoms / form-atoms

Atomic form primitives for Jotai

Home Page:https://codesandbox.io/s/getting-started-with-form-atoms-v2-ddhgq2?file=/src/App.tsx

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

How to set the initial values of a form?

emi2k01 opened this issue · comments

I want to populate a form with values I get dynamically (from a http request, etc).

Is the only option using <Field> or can I pass values through a <Provider>-like component

EDIT: Ended up doing something like

const fooAtom = fieldAtom({ value: 0 });

const fields = {
  foo: fooAtom,
}
type FormFields = typeof fields;

const myFormAtom = formAtom(fields);

interface FormProps {
  initialValues: {
    [Field in keyof FormFields]: any,
  }
}

const Form = ({ initialValues }) => {
  useFieldAtomInitialValue(fooAtom, initialValues.foo);
  return <form>...</form>
}

Yeah unfortunately due to the constraints of Jotai your solution and creating your form/field atom dynamically in your components are the only two options.