const schema = z.object({
age: z.coerce.number().min(18)
.refine((val) => {
console.log('REFINED VALUE: ', typeof val, val)
return true
})
})
type InputType = z.input<typeof schema>
const TanstackFormExample = () => {
const defaultValues: InputType = {
age: 12
}
const form = useForm({
defaultValues,
validators: {
onSubmit: schema
},
onSubmit: ({ value }) => {
console.log('ON SUBMIT: ', typeof value.age, value.age)
}
})
return (
...
<form.Field name='age'>
{(field) => (
<TextInput
placeholder='Age'
value={field.state.value}
onChange={(e) => field.handleChange(e.target.value as unknown as number)}
onBlur={field.handleBlur}
error={field.state.meta.errors[0]?.message}
/>
)}
</form.Field>
...
)
}
const schema = z.object({
age: z.coerce.number().min(18)
.refine((val) => {
console.log('REFINED VALUE: ', typeof val, val)
return true
})
})
type InputType = z.input<typeof schema>
const TanstackFormExample = () => {
const defaultValues: InputType = {
age: 12
}
const form = useForm({
defaultValues,
validators: {
onSubmit: schema
},
onSubmit: ({ value }) => {
console.log('ON SUBMIT: ', typeof value.age, value.age)
}
})
return (
...
<form.Field name='age'>
{(field) => (
<TextInput
placeholder='Age'
value={field.state.value}
onChange={(e) => field.handleChange(e.target.value as unknown as number)}
onBlur={field.handleBlur}
error={field.state.meta.errors[0]?.message}
/>
)}
</form.Field>
...
)
}