fix: modal afterClose trigger twice
parent
2cbc72f617
commit
83f7c6ed41
|
@ -2,6 +2,7 @@ import PropTypes from './vue-types';
|
||||||
import switchScrollingEffect from './switchScrollingEffect';
|
import switchScrollingEffect from './switchScrollingEffect';
|
||||||
import setStyle from './setStyle';
|
import setStyle from './setStyle';
|
||||||
import Portal from './Portal';
|
import Portal from './Portal';
|
||||||
|
import syncWatch from './syncWatch';
|
||||||
|
|
||||||
let openCount = 0;
|
let openCount = 0;
|
||||||
const windowIsUndefined = !(
|
const windowIsUndefined = !(
|
||||||
|
@ -32,9 +33,9 @@ export default {
|
||||||
this.setWrapperClassName();
|
this.setWrapperClassName();
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
visible(val) {
|
visible: syncWatch(function(val) {
|
||||||
openCount = val ? openCount + 1 : openCount - 1;
|
openCount = val ? openCount + 1 : openCount - 1;
|
||||||
},
|
}),
|
||||||
getContainer(getContainer, prevGetContainer) {
|
getContainer(getContainer, prevGetContainer) {
|
||||||
const getContainerIsFunc =
|
const getContainerIsFunc =
|
||||||
typeof getContainer === 'function' && typeof prevGetContainer === 'function';
|
typeof getContainer === 'function' && typeof prevGetContainer === 'function';
|
||||||
|
|
|
@ -11,6 +11,7 @@ const ButtonType = buttonTypes().type;
|
||||||
import LocaleReceiver from '../locale-provider/LocaleReceiver';
|
import LocaleReceiver from '../locale-provider/LocaleReceiver';
|
||||||
import { initDefaultProps, getComponent, getSlot } from '../_util/props-util';
|
import { initDefaultProps, getComponent, getSlot } from '../_util/props-util';
|
||||||
import { ConfigConsumerProps } from '../config-provider';
|
import { ConfigConsumerProps } from '../config-provider';
|
||||||
|
import syncWatch from '../_util/syncWatch';
|
||||||
|
|
||||||
let mousePosition = null;
|
let mousePosition = null;
|
||||||
// ref: https://github.com/ant-design/ant-design/issues/15795
|
// ref: https://github.com/ant-design/ant-design/issues/15795
|
||||||
|
@ -106,9 +107,9 @@ export default {
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
visible(val) {
|
visible: syncWatch(function(val) {
|
||||||
this.sVisible = val;
|
this.sVisible = val;
|
||||||
},
|
}),
|
||||||
},
|
},
|
||||||
setup() {
|
setup() {
|
||||||
return {
|
return {
|
||||||
|
|
|
@ -65,7 +65,6 @@ export default {
|
||||||
}),
|
}),
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
destroyPopup: false,
|
|
||||||
inTransition: false,
|
inTransition: false,
|
||||||
titleId: `rcDialogTitle${uuid++}`,
|
titleId: `rcDialogTitle${uuid++}`,
|
||||||
dialogMouseDown: undefined,
|
dialogMouseDown: undefined,
|
||||||
|
@ -74,9 +73,6 @@ export default {
|
||||||
|
|
||||||
watch: {
|
watch: {
|
||||||
visible(val) {
|
visible(val) {
|
||||||
if (val) {
|
|
||||||
this.destroyPopup = false;
|
|
||||||
}
|
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.updatedCallback(!val);
|
this.updatedCallback(!val);
|
||||||
});
|
});
|
||||||
|
@ -147,15 +143,12 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onAnimateLeave() {
|
onAnimateLeave() {
|
||||||
const { afterClose, destroyOnClose } = this;
|
const { afterClose } = this;
|
||||||
// need demo?
|
// need demo?
|
||||||
// https://github.com/react-component/dialog/pull/28
|
// https://github.com/react-component/dialog/pull/28
|
||||||
if (this.$refs.wrap) {
|
if (this.$refs.wrap) {
|
||||||
this.$refs.wrap.style.display = 'none';
|
this.$refs.wrap.style.display = 'none';
|
||||||
}
|
}
|
||||||
if (destroyOnClose) {
|
|
||||||
this.destroyPopup = true;
|
|
||||||
}
|
|
||||||
this.inTransition = false;
|
this.inTransition = false;
|
||||||
this.switchScrollingEffect();
|
this.switchScrollingEffect();
|
||||||
if (afterClose) {
|
if (afterClose) {
|
||||||
|
@ -295,7 +288,7 @@ export default {
|
||||||
});
|
});
|
||||||
return (
|
return (
|
||||||
<Transition key="dialog" {...dialogTransitionProps}>
|
<Transition key="dialog" {...dialogTransitionProps}>
|
||||||
{visible || !this.destroyPopup ? dialogElement : null}
|
{visible || !this.destroyOnClose ? dialogElement : null}
|
||||||
</Transition>
|
</Transition>
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
|
|
|
@ -15,7 +15,7 @@ Use Drawer to quickly preview details of an object, such as those in a list.
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import demo from '../antdv-demo/docs/carousel/demo';
|
import demo from '../antdv-demo/docs/modal/demo';
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
demo,
|
demo,
|
||||||
|
|
Loading…
Reference in New Issue