From ba0bf23bc711565142e844151aa7aef6caaea886 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tu=C4=9F=C3=A7e=20K=C3=BC=C3=A7=C3=BCko=C4=9Flu?=
 <tugcekucukoglu.860@gmail.com>
Date: Mon, 20 Mar 2023 15:52:27 +0300
Subject: [PATCH] Knob validation demo update

---
 doc/knob/form/VeeValidateDoc.vue | 44 +++++++++++++++++---------------
 1 file changed, 23 insertions(+), 21 deletions(-)

diff --git a/doc/knob/form/VeeValidateDoc.vue b/doc/knob/form/VeeValidateDoc.vue
index 65aa38d0e..4a190dd91 100644
--- a/doc/knob/form/VeeValidateDoc.vue
+++ b/doc/knob/form/VeeValidateDoc.vue
@@ -19,14 +19,12 @@ import { useField, useForm } from 'vee-validate';
 export default {
     setup() {
         const { handleSubmit, resetForm } = useForm();
-
         const { value, errorMessage } = useField('value', validateField, {
-            validateOnValueUpdate: false
+            validateOnValueUpdate: false,
+            initialValue: 0
         });
         const toast = useToast();
 
-        value.value = 0;
-
         function validateField(value) {
             if (!value) {
                 return 'The value must be greater than zero.';
@@ -38,9 +36,11 @@ export default {
         const onSubmit = handleSubmit((values) => {
             if (values.value > 0) {
                 toast.add({ severity: 'info', summary: 'Form Submitted', detail: values.value, life: 3000 });
-                resetForm();
-
-                value.value = 0;
+                resetForm({
+                    values: {
+                        value: 0
+                    }
+                });
             }
         });
 
@@ -79,12 +79,11 @@ export default {
     setup() {
         const { handleSubmit, resetForm } = useForm();
         const { value, errorMessage } = useField('value', validateField, {
-            validateOnValueUpdate: false
+            validateOnValueUpdate: false,
+            initialValue: 0
         });
         const toast = useToast();
 
-        value.value = 0;
-
         function validateField(value) {
             if (!value) {
                 return 'The value must be greater than zero.';
@@ -96,9 +95,11 @@ export default {
         const onSubmit = handleSubmit((values) => {
             if (values.value > 0) {
                 toast.add({ severity: 'info', summary: 'Form Submitted', detail: values.value, life: 3000 });
-                resetForm();
-
-                value.value = 0;
+                resetForm({
+                    values: {
+                        value: 0
+                    }
+                });
             }
         });
 
@@ -123,13 +124,12 @@ import { useToast } from 'primevue/usetoast';
 import { useField, useForm } from 'vee-validate';
 
 const { handleSubmit, resetForm } = useForm();
-const { value, errorMessage } = useField('value', validateField,{
-            validateOnValueUpdate: false
-        });
+const { value, errorMessage } = useField('value', validateField, {
+    validateOnValueUpdate: false,
+    initialValue: 0
+});
 const toast = useToast();
 
-value.value = 0;
-
 function validateField(value) {
     if (!value) {
         return 'The value must be greater than zero.';
@@ -141,9 +141,11 @@ function validateField(value) {
 const onSubmit = handleSubmit((values) => {
     if (values.value > 0) {
         toast.add({ severity: 'info', summary: 'Form Submitted', detail: values.value, life: 3000 });
-        resetForm();
-
-        value.value = 0;
+        resetForm({
+            values: {
+                value: 0
+            }
+        });
     }
 });
 <\/script>