提交 2346a90c 作者: 无木

fix(modal): `maskClosable` and `Esc` take no effect

修复BasicModal按Esc和点击遮罩无法关闭的问题

fixed: #1203
上级 6544f84b
<template> <template>
<Modal v-bind="getBindValue"> <Modal v-bind="getBindValue" @cancel="handleCancel">
<template #closeIcon v-if="!$slots.closeIcon"> <template #closeIcon v-if="!$slots.closeIcon">
<ModalClose <ModalClose
:canFullscreen="getProps.canFullscreen" :canFullscreen="getProps.canFullscreen"
...@@ -72,6 +72,7 @@ ...@@ -72,6 +72,7 @@
import { basicProps } from './props'; import { basicProps } from './props';
import { useFullScreen } from './hooks/useModalFullScreen'; import { useFullScreen } from './hooks/useModalFullScreen';
import { omit } from 'lodash-es'; import { omit } from 'lodash-es';
import { useDesign } from '/@/hooks/web/useDesign';
export default defineComponent({ export default defineComponent({
name: 'BasicModal', name: 'BasicModal',
...@@ -83,6 +84,7 @@ ...@@ -83,6 +84,7 @@
const visibleRef = ref(false); const visibleRef = ref(false);
const propsRef = ref<Partial<ModalProps> | null>(null); const propsRef = ref<Partial<ModalProps> | null>(null);
const modalWrapperRef = ref<any>(null); const modalWrapperRef = ref<any>(null);
const { prefixCls } = useDesign('basic-modal');
// modal Bottom and top height // modal Bottom and top height
const extHeightRef = ref(0); const extHeightRef = ref(0);
...@@ -175,7 +177,8 @@ ...@@ -175,7 +177,8 @@
// 取消事件 // 取消事件
async function handleCancel(e: Event) { async function handleCancel(e: Event) {
e?.stopPropagation(); e?.stopPropagation();
// 过滤自定义关闭按钮的空白区域
if ((e.target as HTMLElement)?.classList?.contains(prefixCls + '-close--custom')) return;
if (props.closeFunc && isFunction(props.closeFunc)) { if (props.closeFunc && isFunction(props.closeFunc)) {
const isClose: boolean = await props.closeFunc(); const isClose: boolean = await props.closeFunc();
visibleRef.value = !isClose; visibleRef.value = !isClose;
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论