Function: useForm()

Imported from @react-logic/utils

useForm<S>(handle): FormComponent<S>

Defined in: utils/src/lib/use-form.tsx:292

Bind a FormHandle to a React component. Returns a <Form> component whose bind and error properties are proxies mirroring the schema — spread Form.bind.email into an <input>, read Form.error.email to branch on per-validator failures.

const Signup = () => {
  const logic = useLogic(SignupLogic);
  const Form = useForm(logic.form);
  return (
    <Form onSubmit={(values) => logic.submit(values)}>
      <input {...Form.bind.email} />
      {Form.error.email.required && <p>Email is required</p>}
      <input {...Form.bind.address.city} />
      <button type="submit" disabled={!logic.form().valid}>Sign up</button>
    </Form>
  );
};

Type Parameters

S

S extends Schema

The schema (inferred from handle).

Parameters

handle

FormHandle<S>

Returns

FormComponent<S>