fix: unregister fields once they are unmounted

logaretm · Jul 23, 2020 · 0d601cb · 0d601cb
1 parent 8393acc
commit 0d601cb
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 1 deletion.
diff --git a/packages/core/src/types.ts b/packages/core/src/types.ts
@@ -44,6 +44,7 @@ export type Flag =
 
 export interface FormController {
   register(field: any): void;
+  unregister(field: any): void;
   values: ComputedRef<Record<string, any>>;
   fields: ComputedRef<Record<string, any>>;
   schema?: Record<string, GenericValidateFunction | string | Record<string, any>>;

diff --git a/packages/core/src/useField.ts b/packages/core/src/useField.ts
@@ -1,4 +1,16 @@
-import { watch, ref, Ref, isRef, reactive, computed, onMounted, toRefs, watchEffect, inject } from 'vue';
+import {
+  watch,
+  ref,
+  Ref,
+  isRef,
+  reactive,
+  computed,
+  onMounted,
+  toRefs,
+  watchEffect,
+  inject,
+  onBeforeUnmount,
+} from 'vue';
 import { validate } from './validate';
 import {
   FormController,
@@ -105,6 +117,10 @@ export function useField(fieldName: MaybeReactive<string>, rules: RuleExpression
   // associate the field with the given form
   form.register(field);
 
+  onBeforeUnmount(() => {
+    form.unregister(field);
+  });
+
   // extract cross-field dependencies in a computed prop
   const dependencies = computed(() => {
     const rulesVal = normalizedRules.value;

diff --git a/packages/core/src/useForm.ts b/packages/core/src/useForm.ts
@@ -51,6 +51,14 @@ export function useForm(opts?: FormOptions) {
 
       fields.value.push(field);
     },
+    unregister(field: FieldComposite) {
+      const idx = fields.value.indexOf(field);
+      if (idx === -1) {
+        return;
+      }
+
+      fields.value.splice(idx, 1);
+    },
     fields: fieldsById,
     values,
     schema: opts?.validationSchema,