@@ -28,11 +28,17 @@ import { ModalsContainer } from 'vue-final-modal'
28
28
``` ts
29
29
import { VueFinalModal , useModal } from ' vue-final-modal'
30
30
31
- const { open, close, options, patchOptions } = useModal ({
32
- // `component` is optional and the default value is `<VueFinalModal>`.
33
- component: VueFinalModal ,
31
+ const { open, close, destroy, options, patchOptions } = useModal ({
34
32
// Open the modal or not when the modal was created, the default value is `false`.
35
33
defaultModelValue: false ,
34
+ /**
35
+ * If set `keepAlive` to `true`:
36
+ * 1. The `displayDirective` will be set to `show` by default.
37
+ * 2. The modal component will not be removed after the modal closed until you manually execute `destroy()`.
38
+ */
39
+ keepAlive: false ,
40
+ // `component` is optional and the default value is `<VueFinalModal>`.
41
+ component: VueFinalModal ,
36
42
attrs: {
37
43
// Bind props to the modal component (VueFinalModal in this case).
38
44
clickToClose: true ,
@@ -49,6 +55,8 @@ const { open, close, options, patchOptions } = useModal({
49
55
open ().then (() => { /* Do something after modal opened */ })
50
56
// Close the modal
51
57
close ().then (() => { /* Do something after modal closed */ })
58
+ // Destroy the modal manually, it only be needed when the `keepAlive` is set to `true`
59
+ destroy ()
52
60
// Checkout the modal options
53
61
options // the state of the dynamic modal
54
62
0 commit comments