fix(Form): memory leak (#1185)

src/runtime/components/forms/Form.vue

@@ -5,7 +5,7 @@
 </template>
 
 <script lang="ts">
-import { provide, ref, type PropType, defineComponent } from 'vue'
+import { provide, ref, type PropType, defineComponent, onUnmounted, onMounted } from 'vue'
 import { useEventBus } from '@vueuse/core'
 import type { ZodSchema } from 'zod'
 import type { ValidationError as JoiError, Schema as JoiSchema } from 'joi'
@@ -51,10 +51,16 @@ export default defineComponent({
   setup (props, { expose, emit }) {
     const bus = useEventBus<FormEvent>(`form-${uid()}`)
 
-    bus.on(async (event) => {
+    onMounted(() => {
-      if (event.type !== 'submit' && props.validateOn?.includes(event.type)) {
+      bus.on(async (event) => {
-        await validate(event.path, { silent: true })
+        if (event.type !== 'submit' && props.validateOn?.includes(event.type)) {
-      }
+          await validate(event.path, { silent: true })
+        }
+      })
+    })
+
+    onUnmounted(() => {
+      bus.reset()
     })
 
     const errors = ref<FormError[]>([])

src/runtime/utils/uid.ts

@@ -1,5 +1,6 @@
 let _id = 0
 
 export function uid () {
-  return `nuid-${_id++}`
+  _id = (_id + 1) % Number.MAX_SAFE_INTEGER
+  return `nuid-${_id}`
 }