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

This commit is contained in:
无木 2021-06-10 19:48:43 +08:00
parent b387681c00
commit de12babd31
3 changed files with 11 additions and 10 deletions

View File

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

View File

@ -35,8 +35,8 @@
]; ];
}); });
function handleCancel() { function handleCancel(e: Event) {
emit('cancel'); emit('cancel', e);
} }
function handleFullScreen(e: Event) { function handleFullScreen(e: Event) {
e?.stopPropagation(); e?.stopPropagation();

View File

@ -26,12 +26,12 @@
props: basicProps, props: basicProps,
emits: ['ok', 'cancel'], emits: ['ok', 'cancel'],
setup(_, { emit }) { setup(_, { emit }) {
function handleOk() { function handleOk(e: Event) {
emit('ok'); emit('ok', e);
} }
function handleCancel() { function handleCancel(e: Event) {
emit('cancel'); emit('cancel', e);
} }
return { handleOk, handleCancel }; return { handleOk, handleCancel };
}, },