use-form
Installation
@asuikit/form
package does not depend on any other libraries, you can use it with or without @asuikit/core
inputs:
Install with npm:
Install with yarn:
Usage
API overview
All examples below use the following example use-form hook.
Values
List items
Validation
Errors
Validation errors occur when defined validation rules were violated, initialErrors
were specified in useForm properties
or validation errors were set manually.
onReset and onSubmit
Wrapper function for form onSubmit
and onReset
event handler. onSubmit
handler accepts as second argument a function
that will be called with errors object when validation fails.
Touched and dirty
getInputProps
form.getInputProps
returns an object with value
, onChange
, onFocus
, onBlur
and error
that should be spread on input.
As second parameter options can be passed.
type
: defaultinput
. Needs to be configured tocheckbox
if input requireschecked
to be set instead ofvalue
.withError
: defaulttype === 'input'
. Specifies if the returned object contains anerror
property withform.errors[path]
value.withFocus
: defaulttrue
. Specifies if the returned object contains anonFocus
handler. If disabled, the touched state of the form can only be used if all values are set withsetFieldValue
.
UseFormReturnType
UseFormReturnType
can be used when you want to pass form
as a prop to another component: