vee-validate
vee-validate copied to clipboard
The meta.dirty value always true when you use initialValues parameter in useForm()
What happened?
For example, I have this form:
interface EditVersionModalForm {
name: string
name2: string
name3: string
}
const useFormOptions = {
validationSchema: {
name: requiredField,
},
initialValues: {
name: props.tariff.name,
name2: props.tariff.name2,
name3: props.tariff.name3,
},
}
const { defineField, handleSubmit, errors, meta, handleReset } =
useForm<EditVersionModalForm>(useFormOptions)
In this case, I am trying to disable the submit button, when values are didn't change at all. But I get always meta.dirty value as true
I think useForm considers initialValues as "updated values". But if we will think from UX side, it seems should be false, when you give initial values. And only set to true, when initial values are changed.
Reproduction steps
- Create form using
useForm()composable. - Set
initialValuesparameter - Always get a
meta.dirtyvalue astrue
Version
Vue.js 3.x and vee-validate 4.x
What browsers are you seeing the problem on?
- [ ] Firefox
- [x] Chrome
- [ ] Safari
- [ ] Microsoft Edge
Relevant log output
No response
Demo link
I can't. But I think I explained well
Code of Conduct
- [x] I agree to follow this project's Code of Conduct
I'm able to not have dirty set if I set teh values using setValues from useForm(). The false is important.
setValues( { name: formData.value.name, description: formData.value.description || '', }, false );