refactor: throw error in useVfm

Author: hunterliu1003

packages/vue-final-modal/src/useApi.ts

@@ -6,16 +6,22 @@ import type CoreModal from './components/CoreModal/CoreModal.vue'
 import { internalVfmSymbol } from './injectionSymbols'
 
 import type { ComponentProps, Constructor, InternalVfm, ModalSlot, ModalSlotOptions, RawProps, UseModalOptions, UseModalOptionsPrivate, UseModalReturnType, Vfm } from './Modal'
-import { activeVfm, getActiveVfm } from './plugin'
+import { getActiveVfm } from './plugin'
 
 /**
  * Returns the vfm instance. Equivalent to using `$vfm` inside
  * templates.
  */
 export function useVfm(): Vfm {
   const vfm = getActiveVfm()
-  if (__DEV__ && !vfm)
-    consoleError()
+  if (__DEV__ && !vfm) {
+    throw new Error(
+      '[Vue Final Modal]: getActiveVfm was called with no active Vfm. Did you forget to install vfm?\n'
+        + '\tconst vfm = createVfm()\n'
+        + '\tapp.use(vfm)\n'
+        + 'This will fail in production.',
+    )
+  }
 
   return vfm!
 }
@@ -80,10 +86,6 @@ export function useModal<P = InstanceType<typeof VueFinalModal>['$props']>(_opti
   async function open(): Promise<string> {
     await nextTick()
     const vfm = useVfm()
-    if (!vfm) {
-      consoleError()
-      return Promise.resolve('error')
-    }
     if (options.modelValue)
       return Promise.resolve('[Vue Final Modal] modal is already opened.')
 
@@ -152,10 +154,6 @@ export function useModal<P = InstanceType<typeof VueFinalModal>['$props']>(_opti
 
   function destroy(): void {
     const vfm = useVfm()
-    if (!vfm) {
-      consoleError()
-      return
-    }
     const index = vfm.dynamicModals.indexOf(options)
     if (index !== -1)
       vfm.dynamicModals.splice(index, 1)
@@ -221,14 +219,3 @@ export function useVfmAttrs(options: {
 
   return vfmAttrs
 }
-
-function consoleError() {
-  if (__DEV__ && !activeVfm) {
-    throw new Error(
-      '[Vue Final Modal]: getActiveVfm was called with no active Vfm. Did you forget to install vfm?\n'
-        + '\tconst vfm = createVfm()\n'
-        + '\tapp.use(vfm)\n'
-        + 'This will fail in production.',
-    )
-  }
-}

viteplay/src/components/VueFinalModal/Basic.example.vue

@@ -8,7 +8,10 @@ import TestModal from './TestModal.vue'
 console.log('modal → ', modal)
 
 const { toggle, closeAll } = useVfm()
-// modal.open()
+modal.open().then((res) => { console.log('res', res) })
+modal.open().then((res) => { console.log('res', res) })
+modal.open().then((res) => { console.log('res', res) })
+modal.open().then((res) => { console.log('res', res) })
 const modal1 = useModal({
   keepAlive: true,
   component: VueFinalModal,

viteplay/src/components/VueFinalModal/modalsHelpers.ts

@@ -1,6 +1,7 @@
 import { VueFinalModal, useModal, useModalSlot } from 'vue-final-modal'
 import DefaultSlot from '../DefaultSlot.vue'
 
+console.log('helper')
 export const modal = useModal({
   component: VueFinalModal,
   // defaultModelValue: true,