Merge pull request #6163 from wangziling/feature/v3-fix-unexpected-joggle-when-dialog-non-fixed
fix: fix the unexpected joggle state when `dialog` component non-fixedpull/6506/head
commit
41e3865eed
|
@ -1,7 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<Portal :appendTo="appendTo">
|
<Portal :appendTo="appendTo">
|
||||||
<div v-if="containerVisible" :ref="maskRef" :class="cx('mask')" :style="sx('mask', true, { position, modal })" @click="onMaskClick" v-bind="ptm('mask')">
|
<div v-if="containerVisible" :ref="maskRef" :class="cx('mask')" :style="sx('mask', true, { position, modal })" @click="onMaskClick" v-bind="ptm('mask')">
|
||||||
<transition name="p-dialog" @before-enter="onBeforeEnter" @enter="onEnter" @before-leave="onBeforeLeave" @leave="onLeave" @after-leave="onAfterLeave" appear v-bind="ptm('transition')">
|
<transition name="p-dialog" @before-enter="onBeforeEnter" @enter="onEnter" @after-enter="onAfterEnter" @before-leave="onBeforeLeave" @leave="onLeave" @after-leave="onAfterLeave" appear v-bind="ptm('transition')">
|
||||||
<div v-if="visible" :ref="containerRef" v-focustrap="{ disabled: !modal }" :class="cx('root')" :style="sx('root')" role="dialog" :aria-labelledby="ariaLabelledById" :aria-modal="modal" v-bind="ptmi('root')">
|
<div v-if="visible" :ref="containerRef" v-focustrap="{ disabled: !modal }" :class="cx('root')" :style="sx('root')" role="dialog" :aria-labelledby="ariaLabelledById" :aria-modal="modal" v-bind="ptmi('root')">
|
||||||
<slot v-if="$slots.container" name="container" :onClose="close" :onMaximize="(event) => maximize(event)" :closeCallback="close" :maximizeCallback="(event) => maximize(event)"></slot>
|
<slot v-if="$slots.container" name="container" :onClose="close" :onMaximize="(event) => maximize(event)" :closeCallback="close" :maximizeCallback="(event) => maximize(event)"></slot>
|
||||||
<template v-else>
|
<template v-else>
|
||||||
|
@ -141,7 +141,6 @@ export default {
|
||||||
onEnter() {
|
onEnter() {
|
||||||
this.$emit('show');
|
this.$emit('show');
|
||||||
this.target = document.activeElement;
|
this.target = document.activeElement;
|
||||||
this.focus();
|
|
||||||
this.enableDocumentSettings();
|
this.enableDocumentSettings();
|
||||||
this.bindGlobalListeners();
|
this.bindGlobalListeners();
|
||||||
|
|
||||||
|
@ -149,6 +148,9 @@ export default {
|
||||||
ZIndexUtils.set('modal', this.mask, this.baseZIndex + this.$primevue.config.zIndex.modal);
|
ZIndexUtils.set('modal', this.mask, this.baseZIndex + this.$primevue.config.zIndex.modal);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
onAfterEnter() {
|
||||||
|
this.focus();
|
||||||
|
},
|
||||||
onBeforeLeave() {
|
onBeforeLeave() {
|
||||||
if (this.modal) {
|
if (this.modal) {
|
||||||
!this.isUnstyled && DomHandler.addClass(this.mask, 'p-component-overlay-leave');
|
!this.isUnstyled && DomHandler.addClass(this.mask, 'p-component-overlay-leave');
|
||||||
|
|
Loading…
Reference in New Issue