fix(modal): add v-model support for visible

vbenjs · Jun 10, 2021 · de12bab · de12bab
1 parent b387681
commit de12bab
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 10 deletions.
diff --git a/src/components/Modal/src/BasicModal.vue b/src/components/Modal/src/BasicModal.vue
@@ -81,7 +81,7 @@
     components: { Modal, ModalWrapper, ModalClose, ModalFooter, ModalHeader },
     inheritAttrs: false,
     props: basicProps,
-    emits: ['visible-change', 'height-change', 'cancel', 'ok', 'register'],
+    emits: ['visible-change', 'height-change', 'cancel', 'ok', 'register', 'update:visible'],
     setup(props, { emit, attrs }) {
       const visibleRef = ref(false);
       const propsRef = ref<Partial<ModalProps> | null>(null);
@@ -157,6 +157,7 @@
         () => unref(visibleRef),
         (v) => {
           emit('visible-change', v);
+          emit('update:visible', v);
           instance && modalMethods.emitVisible?.(v, instance.uid);
           nextTick(() => {
             if (props.scrollTop && v && unref(modalWrapperRef)) {
@@ -180,7 +181,7 @@
         }
 
         visibleRef.value = false;
-        emit('cancel');
+        emit('cancel', e);
       }
 
       /**
@@ -193,8 +194,8 @@
         visibleRef.value = !!props.visible;
       }
 
-      function handleOk() {
-        emit('ok');
+      function handleOk(e: Event) {
+        emit('ok', e);
       }
 
       function handleHeightChange(height: string) {

diff --git a/src/components/Modal/src/components/ModalClose.vue b/src/components/Modal/src/components/ModalClose.vue
@@ -35,8 +35,8 @@
         ];
       });
 
-      function handleCancel() {
-        emit('cancel');
+      function handleCancel(e: Event) {
+        emit('cancel', e);
       }
       function handleFullScreen(e: Event) {
         e?.stopPropagation();

diff --git a/src/components/Modal/src/components/ModalFooter.vue b/src/components/Modal/src/components/ModalFooter.vue
@@ -26,12 +26,12 @@
     props: basicProps,
     emits: ['ok', 'cancel'],
     setup(_, { emit }) {
-      function handleOk() {
-        emit('ok');
+      function handleOk(e: Event) {
+        emit('ok', e);
       }
 
-      function handleCancel() {
-        emit('cancel');
+      function handleCancel(e: Event) {
+        emit('cancel', e);
       }
       return { handleOk, handleCancel };
     },