Hi,
I currently use Vee-validate 4.7.3 with Vue 3.
I have ran into problem with types.
<template>
<form>
<text-input name="name" label="Name" />
<text-input name="surname" label="Surname" />
</form>
</template>
<script lang="ts">
import { defineComponent } from "vue"
import TextInput from "../../../../components/common/form/TextInput.vue"
import { useForm } from "vee-validate"
type Form = {
name: string
surname: string
age: number
}
export default defineComponent({
components: { TextInput },
setup() {
const { values } = useForm<Form>({
initialValues: {
name: "",
surname: "",
},
})
return {
}
},
})
</script>Here an example of simple form with 3 field. Two of them are string (name, surname) and one is number ( age). I've created a type for this simple form, where every property of type is required. That's because I assume that every field of this form will be filled and eventually POST to server or whatever.
I want to set some default values to this form. For example I want to set name, because I know it and I want to show it as default value in form. I don't know age or surname.
But VeeValidate won't me let set only some of the props and I need to set surname as empty string and age as 0. But I don't want to to be age zero and I can't made age as optional property because, It is required field in form, which will be send to server or whatever.
This is simple example, in reality we have kind of complicated multi step form, where I do certain operations on each step of the form with values, so I can't really change type of the form to Partial<Form>, because I need to know which props are optional and which are required.
Describe the solution you'd like
So shouldn't be property initialValues be typed as MaybeRef<Partial<TValues>> instead of MaybeRef<TValues>. Because not everytime I want to set every property of form as default value, but everytime I need to know, which properties are required/optional.
Describe alternatives you've considered
Pass Partial as generic param to useForm, but this doesn't fit my needs.
Hi,
I currently use Vee-validate 4.7.3 with Vue 3.
I have ran into problem with types.
Here an example of simple form with 3 field. Two of them are string (
name,surname) and one is number (age). I've created a type for this simple form, where every property of type is required. That's because I assume that every field of this form will be filled and eventually POST to server or whatever.I want to set some default values to this form. For example I want to set
name, because I know it and I want to show it as default value in form. I don't knowageorsurname.But VeeValidate won't me let set only some of the props and I need to set
surnameas empty string andageas 0. But I don't want to to be age zero and I can't made age as optional property because, It is required field in form, which will be send to server or whatever.This is simple example, in reality we have kind of complicated multi step form, where I do certain operations on each step of the form with values, so I can't really change type of the form to
Partial<Form>, because I need to know which props are optional and which are required.Describe the solution you'd like
So shouldn't be property
initialValuesbe typed asMaybeRef<Partial<TValues>>instead ofMaybeRef<TValues>. Because not everytime I want to set every property of form as default value, but everytime I need to know, which properties are required/optional.Describe alternatives you've considered
Pass Partial as generic param to
useForm, but this doesn't fit my needs.