chore: update demo abit

This commit is contained in:
zernonia 2024-02-06 10:05:41 +08:00
parent 98f8281235
commit f96a756175
2 changed files with 6 additions and 6 deletions

View File

@ -19,7 +19,7 @@ import {
import { toast } from '@/lib/registry/default/ui/toast' import { toast } from '@/lib/registry/default/ui/toast'
const formSchema = toTypedSchema(z.object({ const formSchema = toTypedSchema(z.object({
pin: z.array(z.string().min(1)).length(5), pin: z.array(z.coerce.string()).length(5, { message: 'Invalid input' }),
})) }))
const { handleSubmit, setValues } = useForm({ const { handleSubmit, setValues } = useForm({
@ -43,7 +43,7 @@ const handleComplete = (e: string[]) => console.log(e.join(''))
<form class="w-2/3 space-y-6 mx-auto" @submit="onSubmit"> <form class="w-2/3 space-y-6 mx-auto" @submit="onSubmit">
<FormField v-slot="{ componentField }" name="pin"> <FormField v-slot="{ componentField }" name="pin">
<FormItem> <FormItem>
<FormLabel>Otp</FormLabel> <FormLabel>OTP</FormLabel>
<FormControl> <FormControl>
<PinInput <PinInput
id="pin-input" id="pin-input"
@ -55,7 +55,7 @@ const handleComplete = (e: string[]) => console.log(e.join(''))
@complete="handleComplete" @complete="handleComplete"
@update:model-value="(arrStr) => { @update:model-value="(arrStr) => {
setValues({ setValues({
pin: arrStr, pin: arrStr.filter(Boolean),
}) })
}" }"
> >

View File

@ -19,7 +19,7 @@ import {
import { toast } from '@/lib/registry/new-york/ui/toast' import { toast } from '@/lib/registry/new-york/ui/toast'
const formSchema = toTypedSchema(z.object({ const formSchema = toTypedSchema(z.object({
pin: z.array(z.string().min(1)).length(5), pin: z.array(z.coerce.string()).length(5, { message: 'Invalid input' }),
})) }))
const { handleSubmit, setValues } = useForm({ const { handleSubmit, setValues } = useForm({
@ -43,7 +43,7 @@ const handleComplete = (e: string[]) => console.log(e.join(''))
<form class="w-2/3 space-y-6 mx-auto" @submit="onSubmit"> <form class="w-2/3 space-y-6 mx-auto" @submit="onSubmit">
<FormField v-slot="{ componentField }" name="pin"> <FormField v-slot="{ componentField }" name="pin">
<FormItem> <FormItem>
<FormLabel>Otp</FormLabel> <FormLabel>OTP</FormLabel>
<FormControl> <FormControl>
<PinInput <PinInput
id="pin-input" id="pin-input"
@ -55,7 +55,7 @@ const handleComplete = (e: string[]) => console.log(e.join(''))
@complete="handleComplete" @complete="handleComplete"
@update:model-value="(arrStr) => { @update:model-value="(arrStr) => {
setValues({ setValues({
pin: arrStr, pin: arrStr.filter(Boolean),
}) })
}" }"
> >