Niklas/shadcn-vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: change setValues to setFieldValue for better validation

Browse Source
This commit is contained in:
romanhrynevych 2024-05-12 22:37:21 +03:00
parent b20a45552a
commit 1a2d7e13d8
8 changed files with 21 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
apps/www/src/content/docs/components/auto-form.md
View File

@ -414,9 +414,7 @@ const form = useForm({
validationSchema: toTypedSchema(schema),
})
form.setValues({
username: 'foo'
})
form.setFieldValue('username', 'bar')
</script>
<template>

14
apps/www/src/examples/forms/components/AccountForm.vue
View File

@ -84,7 +84,7 @@ async function onSubmit(values: any) {
</p>
</div>
<Separator />
<Form v-slot="{ setValues }" :validation-schema="accountFormSchema" class="space-y-8" @submit="onSubmit">
<Form v-slot="{ setFieldValue }" :validation-schema="accountFormSchema" class="space-y-8" @submit="onSubmit">
<FormField v-slot="{ componentField }" name="name">
<FormItem>
<FormLabel>Name</FormLabel>
@ -126,15 +126,11 @@ async function onSubmit(values: any) {
@update:model-value="(v) => {
if (v) {
dateValue = v
setValues({
dob: toDate(v).toISOString(),
}, false)
setFieldValue('dob', toDate(v).toISOString())
}
else {
dateValue = undefined
setValues({
dob: undefined,
}, false)
setFieldValue('dob', undefined)
}
}"
/>
@ -178,9 +174,7 @@ async function onSubmit(values: any) {
<CommandItem
v-for="language in languages" :key="language.value" :value="language.label"
@select="() => {
setValues({
language: language.value,
}, false)
setFieldValue('language', language.value)
open = false
}"
>

10
apps/www/src/lib/registry/default/example/CalendarForm.vue
View File

@ -32,7 +32,7 @@ const formSchema = toTypedSchema(z.object({
const placeholder = ref()
const { handleSubmit, setValues, values } = useForm({
const { handleSubmit, setFieldValue, values } = useForm({
validationSchema: formSchema,
})
@ -79,14 +79,10 @@ const onSubmit = handleSubmit((values) => {
:max-value="today(getLocalTimeZone())"
@update:model-value="(v) => {
if (v) {
setValues({
dob: v.toString(),
})
setFieldValue('dob', v.toString())
}
else {
setValues({
dob: '',
})
setFieldValue('dob', undefined)
}
}"
/>

6
apps/www/src/lib/registry/default/example/ComboboxForm.vue
View File

@ -48,7 +48,7 @@ const formSchema = toTypedSchema(z.object({
}),
}))
const { handleSubmit, setValues, values } = useForm({
const { handleSubmit, setFieldValue, values } = useForm({
validationSchema: formSchema,
})
@ -91,9 +91,7 @@ const onSubmit = handleSubmit((values) => {
:key="language.value"
:value="language.label"
@select="() => {
setValues({
language: language.value,
})
setFieldValue('language', language.value)
}"
>
<Check

10
apps/www/src/lib/registry/default/example/DatePickerForm.vue
View File

@ -32,7 +32,7 @@ const formSchema = toTypedSchema(z.object({
const placeholder = ref()
const { handleSubmit, setValues, values } = useForm({
const { handleSubmit, setFieldValue, values } = useForm({
validationSchema: formSchema,
initialValues: {
@ -82,14 +82,10 @@ const onSubmit = handleSubmit((values) => {
:max-value="today(getLocalTimeZone())"
@update:model-value="(v) => {
if (v) {
setValues({
dob: v.toString(),
})
setFieldValue('dob', v.toString())
}
else {
setValues({
dob: '',
})
setFieldValue('dob', undefined)
}
}"

10
apps/www/src/lib/registry/new-york/example/CalendarForm.vue
View File

@ -32,7 +32,7 @@ const formSchema = toTypedSchema(z.object({
const placeholder = ref()
const { handleSubmit, setValues, values } = useForm({
const { handleSubmit, setFieldValue, values } = useForm({
validationSchema: formSchema,
})
@ -79,14 +79,10 @@ const onSubmit = handleSubmit((values) => {
:max-value="today(getLocalTimeZone())"
@update:model-value="(v) => {
if (v) {
setValues({
dob: v.toString(),
})
setFieldValue('dob', v.toString())
}
else {
setValues({
dob: '',
})
setFieldValue('dob', undefined)
}
}"
/>

6
apps/www/src/lib/registry/new-york/example/ComboboxForm.vue
View File

@ -48,7 +48,7 @@ const formSchema = toTypedSchema(z.object({
}),
}))
const { handleSubmit, setValues, values } = useForm({
const { handleSubmit, setFieldValue, values } = useForm({
validationSchema: formSchema,
initialValues: {
language: '',
@ -94,9 +94,7 @@ const onSubmit = handleSubmit((values) => {
:key="language.value"
:value="language.label"
@select="() => {
setValues({
language: language.value,
})
setFieldValue('language', language.value)
}"
>
{{ language.label }}

11
apps/www/src/lib/registry/new-york/example/DatePickerForm.vue
View File

@ -32,7 +32,7 @@ const formSchema = toTypedSchema(z.object({
const placeholder = ref()
const { handleSubmit, setValues, values } = useForm({
const { handleSubmit, setFieldValue, values } = useForm({
validationSchema: formSchema,
initialValues: {
@ -82,16 +82,11 @@ const onSubmit = handleSubmit((values) => {
:max-value="today(getLocalTimeZone())"
@update:model-value="(v) => {
if (v) {
setValues({
dob: v.toString(),
})
setFieldValue('dob', v.toString())
}
else {
setValues({
dob: '',
})
setFieldValue('dob', undefined)
}
}"
/>
</PopoverContent>