input
Stateful input component with error handling based on the stateless Input component in vdux-ui.
Installation
$ npm install vdux-input
Usage
All the props are the same as for . The only difference is that this component holds a little bit of state around error messages so that it works with Form. You can use it like this:
function render () {
return (
<Form onSubmit={createUser} validate={validateUser}>
<Input name='username' />
</Form>
)
}
function validateUser (user) {
if (!user.username || user.username.length <= 3) {
return {
valid: false,
errors: [
{
field: 'username',
message: 'Username must be at least 3 characters'
}
]
}
}
return {
valid: true
}
}Validation functions
If you want an easy, simple way to create reusable schemas that generate errors in this form, check out:
- schema - Clean, fluent API for creating schemas
-
validate - Takes a schema and returns a
validate(model)function that returns errors in the format used here.
API - props
The props API is the same as vdux-ui/input. Refer to that for props documentation.
License
MIT