diff --git a/components/lib/dialog/Dialog.vue b/components/lib/dialog/Dialog.vue index e66eed02f..52437121c 100755 --- a/components/lib/dialog/Dialog.vue +++ b/components/lib/dialog/Dialog.vue @@ -80,12 +80,18 @@ export default { }, data() { return { + id: this.$attrs.id, containerVisible: this.visible, maximized: false, focusableMax: null, focusableClose: null }; }, + watch: { + '$attrs.id': function (newValue) { + this.id = newValue || UniqueComponentId(); + } + }, documentKeydownListener: null, container: null, mask: null, @@ -118,6 +124,8 @@ export default { this.mask = null; }, mounted() { + this.id = this.id || UniqueComponentId(); + if (this.breakpoints) { this.createStyle(); } @@ -380,12 +388,8 @@ export default { maximizeIconComponent() { return this.maximized ? (this.minimizeIcon ? 'span' : 'WindowMinimizeIcon') : this.maximizeIcon ? 'span' : 'WindowMaximizeIcon'; }, - - ariaId() { - return UniqueComponentId(); - }, ariaLabelledById() { - return this.header != null || this.$attrs['aria-labelledby'] !== null ? this.ariaId + '_header' : null; + return this.header != null || this.$attrs['aria-labelledby'] !== null ? this.id + '_header' : null; }, closeAriaLabel() { return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.close : undefined;