react-uniformed › "useForm"

Module: "useForm"

Index

Interfaces

• UseFormsHook

Functions

• useForm

Functions

useForm

▸ useForm(__namedParameters: object): UseFormsHook

A hook that allows you to declaratively manage a form.

See useTouch
See useFields
See useValidation
See useSubmission
See useConstraints
See useValidateAsSetter
See useSettersAsEventHandler
See useSettersAsRefEventHandler

example Basic example

const { submit, setValue, values } = useForm({
  onSubmit: (data) => alert(JSON.stringify(data)),
});
const handleChange = useSettersAsEventHandler(setValue);

// jsx
<form onSubmit={submit}>
  <input name='name' value={values.name} onChange={handleChange} />
</form>;

example Using validate in change events

const { submit, setValue, validate, values } = useForm({
  onSubmit: (data) => alert(JSON.stringify(data)),
});
// Warning: validating all inputs on change could lead to performance issues,
// especially if you have a big form or complex validation logic.
const validateAllOnChange = useValidateAsSetter(validate, values);
// this will set the value of inputs on change and validate all form inputs
const handleChange = useSettersAsEventHandler(setValue, validateAllOnChange);

// jsx
<form onSubmit={submit}>
  <input name='name' value={values.name} onChange={handleChange} />
</form>;

example Setting feedback on submit, see useSubmission

example Validation errors from the server, see useSubmission

Parameters:

▪ __namedParameters: object

Name	Type	Description
constraints	Values‹Validator | Constraints› | SyncedConstraint	Passed directly to useConstraints. Note that you can only use one validator at a time. For instance, if you pass in a value to validators, then the constraints prop will be ignored in favor of validators.
initialValues	undefined | object	passed as the first argument to useFields.
normalizer	undefined | NormalizerHandler	passed as the second argument to useFields. See useNormalizers for more details.
rawOnSubmit	SubmissionHandler	-
validators	Values‹Validator› | SingleValidator‹any›	passed directly to useValidation.

Returns: UseFormsHook

the APIs used to manage the state of a function.