Merge pull request #5486 from i7slegend/fix/5412-twice-render

Fix #5412 - Twice render if attribute id not defined
primefaces · Apr 3, 2024 · 52fc487 · 52fc487
2 parents 0c44e20 + 85a9455
commit 52fc487
Show file tree

Hide file tree

Showing 30 changed files with 151 additions and 120 deletions.
diff --git a/components/lib/accordion/Accordion.vue b/components/lib/accordion/Accordion.vue
@@ -73,16 +73,16 @@ export default {
         };
     },
     watch: {
-        '$attrs.id': function (newValue) {
-            this.id = newValue || UniqueComponentId();
+        '$attrs.id': {
+            immediate: true,
+            handler: function (newValue) {
+                this.id = newValue || UniqueComponentId();
+            }
         },
         activeIndex(newValue) {
             this.d_activeIndex = newValue;
         }
     },
-    mounted() {
-        this.id = this.id || UniqueComponentId();
-    },
     methods: {
         isAccordionTab(child) {
             return child.type.name === 'AccordionTab';

diff --git a/components/lib/autocomplete/AutoComplete.vue b/components/lib/autocomplete/AutoComplete.vue
@@ -201,8 +201,11 @@ export default {
         };
     },
     watch: {
-        '$attrs.id': function (newValue) {
-            this.id = newValue || UniqueComponentId();
+        '$attrs.id': {
+            immediate: true,
+            handler: function (newValue) {
+                this.id = newValue || UniqueComponentId();
+            }
         },
         suggestions() {
             if (this.searching) {
@@ -215,7 +218,6 @@ export default {
         }
     },
     mounted() {
-        this.id = this.id || UniqueComponentId();
         this.autoUpdateModel();
     },
     updated() {

diff --git a/components/lib/calendar/Calendar.vue b/components/lib/calendar/Calendar.vue
@@ -560,8 +560,11 @@ export default {
         };
     },
     watch: {
-        id: function (newValue) {
-            this.d_id = newValue || UniqueComponentId();
+        id: {
+            immediate: true,
+            handler: function (newValue) {
+                this.d_id = newValue || UniqueComponentId();
+            }
         },
         modelValue(newValue) {
             this.updateCurrentMetaData();
@@ -611,7 +614,6 @@ export default {
         this.updateCurrentMetaData();
     },
     mounted() {
-        this.d_id = this.d_id || UniqueComponentId();
         this.createResponsiveStyle();
         this.bindMatchMediaListener();
 

diff --git a/components/lib/cascadeselect/CascadeSelect.vue b/components/lib/cascadeselect/CascadeSelect.vue
@@ -110,15 +110,17 @@ export default {
         };
     },
     watch: {
-        '$attrs.id': function (newValue) {
-            this.id = newValue || UniqueComponentId();
+        '$attrs.id': {
+            immediate: true,
+            handler: function (newValue) {
+                this.id = newValue || UniqueComponentId();
+            }
         },
         options() {
             this.autoUpdateModel();
         }
     },
     mounted() {
-        this.id = this.id || UniqueComponentId();
         this.autoUpdateModel();
     },
     beforeUnmount() {

diff --git a/components/lib/chips/Chips.vue b/components/lib/chips/Chips.vue
@@ -76,13 +76,13 @@ export default {
         };
     },
     watch: {
-        '$attrs.id': function (newValue) {
-            this.id = newValue || UniqueComponentId();
+        '$attrs.id': {
+            immediate: true,
+            handler: function (newValue) {
+                this.id = newValue || UniqueComponentId();
+            }
         }
     },
-    mounted() {
-        this.id = this.id || UniqueComponentId();
-    },
     methods: {
         onWrapperClick() {
             this.$refs.input.focus();

diff --git a/components/lib/contextmenu/ContextMenu.vue b/components/lib/contextmenu/ContextMenu.vue
@@ -64,8 +64,11 @@ export default {
         };
     },
     watch: {
-        '$attrs.id': function (newValue) {
-            this.id = newValue || UniqueComponentId();
+        '$attrs.id': {
+            immediate: true,
+            handler: function (newValue) {
+                this.id = newValue || UniqueComponentId();
+            }
         },
         activeItemPath(newPath) {
             if (ObjectUtils.isNotEmpty(newPath)) {
@@ -78,8 +81,6 @@ export default {
         }
     },
     mounted() {
-        this.id = this.id || UniqueComponentId();
-
         if (this.global) {
             this.bindDocumentContextMenuListener();
         }

diff --git a/components/lib/datatable/ColumnFilter.vue b/components/lib/datatable/ColumnFilter.vue
@@ -286,8 +286,11 @@ export default {
         };
     },
     watch: {
-        '$attrs.id': function (newValue) {
-            this.id = newValue || UniqueComponentId();
+        '$attrs.id': {
+            immediate: true,
+            handler: function (newValue) {
+                this.id = newValue || UniqueComponentId();
+            }
         }
     },
     overlay: null,
@@ -305,8 +308,6 @@ export default {
         }
     },
     mounted() {
-        this.id = this.id || UniqueComponentId();
-
         if (this.filters && this.filters[this.field]) {
             let fieldFilters = this.filters[this.field];
 

diff --git a/components/lib/dialog/Dialog.vue b/components/lib/dialog/Dialog.vue
@@ -88,8 +88,11 @@ export default {
         };
     },
     watch: {
-        '$attrs.id': function (newValue) {
-            this.id = newValue || UniqueComponentId();
+        '$attrs.id': {
+            immediate: true,
+            handler: function (newValue) {
+                this.id = newValue || UniqueComponentId();
+            }
         }
     },
     documentKeydownListener: null,
@@ -124,8 +127,6 @@ export default {
         this.mask = null;
     },
     mounted() {
-        this.id = this.id || UniqueComponentId();
-
         if (this.breakpoints) {
             this.createStyle();
         }

diff --git a/components/lib/dock/DockSub.vue b/components/lib/dock/DockSub.vue
@@ -106,13 +106,13 @@ export default {
         };
     },
     watch: {
-        menuId(newValue) {
-            this.id = newValue || UniqueComponentId();
+        menuId: {
+            immediate: true,
+            handler(newValue) {
+                this.id = newValue || UniqueComponentId();
+            }
         }
     },
-    mounted() {
-        this.id = this.id || UniqueComponentId();
-    },
     methods: {
         getItemId(index) {
             return `${this.id}_${index}`;

diff --git a/components/lib/dropdown/Dropdown.vue b/components/lib/dropdown/Dropdown.vue
@@ -218,8 +218,11 @@ export default {
         };
     },
     watch: {
-        '$attrs.id': function (newValue) {
-            this.id = newValue || UniqueComponentId();
+        '$attrs.id': {
+            immediate: true,
+            handler: function (newValue) {
+                this.id = newValue || UniqueComponentId();
+            }
         },
         modelValue() {
             this.isModelValueChanged = true;
@@ -229,7 +232,6 @@ export default {
         }
     },
     mounted() {
-        this.id = this.id || UniqueComponentId();
         this.autoUpdateModel();
         this.bindLabelClickListener();
     },

diff --git a/components/lib/fieldset/Fieldset.vue b/components/lib/fieldset/Fieldset.vue
@@ -54,16 +54,16 @@ export default {
         };
     },
     watch: {
-        '$attrs.id': function (newValue) {
-            this.id = newValue || UniqueComponentId();
+        '$attrs.id': {
+            immediate: true,
+            handler: function (newValue) {
+                this.id = newValue || UniqueComponentId();
+            }
         },
         collapsed(newValue) {
             this.d_collapsed = newValue;
         }
     },
-    mounted() {
-        this.id = this.id || UniqueComponentId();
-    },
     methods: {
         toggle(event) {
             this.d_collapsed = !this.d_collapsed;

diff --git a/components/lib/galleria/GalleriaContent.vue b/components/lib/galleria/GalleriaContent.vue
@@ -76,15 +76,18 @@ export default {
     emits: ['activeitem-change', 'mask-hide'],
     data() {
         return {
-            id: this.$attrs.id || UniqueComponentId(),
+            id: this.$attrs.id,
             activeIndex: this.$attrs.activeIndex,
             numVisible: this.$attrs.numVisible,
             slideShowActive: false
         };
     },
     watch: {
-        '$attrs.id': function (newValue) {
-            this.id = newValue || UniqueComponentId();
+        '$attrs.id': {
+            immediate: true,
+            handler: function (newValue) {
+                this.id = newValue || UniqueComponentId();
+            }
         },
         '$attrs.value': function (newVal) {
             if (newVal && newVal.length < this.numVisible) {
@@ -101,9 +104,6 @@ export default {
             newVal ? this.startSlideShow() : this.stopSlideShow();
         }
     },
-    mounted() {
-        this.id = this.id || UniqueComponentId();
-    },
     updated() {
         this.$emit('activeitem-change', this.activeIndex);
     },

diff --git a/components/lib/listbox/Listbox.vue b/components/lib/listbox/Listbox.vue
@@ -149,15 +149,17 @@ export default {
         };
     },
     watch: {
-        '$attrs.id': function (newValue) {
-            this.id = newValue || UniqueComponentId();
+        '$attrs.id': {
+            immediate: true,
+            handler: function (newValue) {
+                this.id = newValue || UniqueComponentId();
+            }
         },
         options() {
             this.autoUpdateModel();
         }
     },
     mounted() {
-        this.id = this.id || UniqueComponentId();
         this.autoUpdateModel();
     },
     methods: {

diff --git a/components/lib/megamenu/MegaMenu.vue b/components/lib/megamenu/MegaMenu.vue
@@ -86,8 +86,11 @@ export default {
         };
     },
     watch: {
-        '$attrs.id': function (newValue) {
-            this.id = newValue || UniqueComponentId();
+        '$attrs.id': {
+            immediate: true,
+            handler: function (newValue) {
+                this.id = newValue || UniqueComponentId();
+            }
         },
         activeItem(newItem) {
             if (ObjectUtils.isNotEmpty(newItem)) {
@@ -100,7 +103,6 @@ export default {
         }
     },
     mounted() {
-        this.id = this.id || UniqueComponentId();
         this.bindMatchMediaListener();
     },
     beforeUnmount() {

diff --git a/components/lib/menu/Menu.vue b/components/lib/menu/Menu.vue
@@ -72,8 +72,11 @@ export default {
         };
     },
     watch: {
-        '$attrs.id': function (newValue) {
-            this.id = newValue || UniqueComponentId();
+        '$attrs.id': {
+            immediate: true,
+            handler: function (newValue) {
+                this.id = newValue || UniqueComponentId();
+            }
         }
     },
     target: null,
@@ -83,8 +86,6 @@ export default {
     container: null,
     list: null,
     mounted() {
-        this.id = this.id || UniqueComponentId();
-
         if (!this.popup) {
             this.bindResizeListener();
             this.bindOutsideClickListener();

diff --git a/components/lib/menubar/Menubar.vue b/components/lib/menubar/Menubar.vue
@@ -79,8 +79,11 @@ export default {
         };
     },
     watch: {
-        '$attrs.id': function (newValue) {
-            this.id = newValue || UniqueComponentId();
+        '$attrs.id': {
+            immediate: true,
+            handler: function (newValue) {
+                this.id = newValue || UniqueComponentId();
+            }
         },
         activeItemPath(newPath) {
             if (ObjectUtils.isNotEmpty(newPath)) {
@@ -96,7 +99,6 @@ export default {
     container: null,
     menubar: null,
     mounted() {
-        this.id = this.id || UniqueComponentId();
         this.bindMatchMediaListener();
     },
     beforeUnmount() {

diff --git a/components/lib/multiselect/MultiSelect.vue b/components/lib/multiselect/MultiSelect.vue
@@ -238,15 +238,17 @@ export default {
         };
     },
     watch: {
-        '$attrs.id': function (newValue) {
-            this.id = newValue || UniqueComponentId();
+        '$attrs.id': {
+            immediate: true,
+            handler: function (newValue) {
+                this.id = newValue || UniqueComponentId();
+            }
         },
         options() {
             this.autoUpdateModel();
         }
     },
     mounted() {
-        this.id = this.id || UniqueComponentId();
         this.autoUpdateModel();
     },
     beforeUnmount() {