Bladeren bron

Tabs: rerender when slot changes (#15238)

hetech 6 jaren geleden
bovenliggende
commit
0325e1dc4d
2 gewijzigde bestanden met toevoegingen van 5 en 7 verwijderingen
  1. 2 4
      packages/tabs/src/tab-pane.vue
  2. 3 3
      packages/tabs/src/tabs.vue

+ 2 - 4
packages/tabs/src/tab-pane.vue

@@ -49,10 +49,8 @@
       }
     },
 
-    watch: {
-      label() {
-        this.$parent.$emit('tabLabelChanged');
-      }
+    updated() {
+      this.$parent.$emit('tab-nav-update');
     }
   };
 </script>

+ 3 - 3
packages/tabs/src/tabs.vue

@@ -55,14 +55,14 @@
     },
 
     methods: {
-      calcPaneInstances(isLabelUpdated = false) {
+      calcPaneInstances(isForceUpdate = false) {
         if (this.$slots.default) {
           const paneSlots = this.$slots.default.filter(vnode => vnode.tag &&
             vnode.componentOptions && vnode.componentOptions.Ctor.options.name === 'ElTabPane');
           // update indeed
           const panes = paneSlots.map(({ componentInstance }) => componentInstance);
           const panesChanged = !(panes.length === this.panes.length && panes.every((pane, index) => pane === this.panes[index]));
-          if (isLabelUpdated || panesChanged) {
+          if (isForceUpdate || panesChanged) {
             this.panes = panes;
           }
         } else if (this.panes.length !== 0) {
@@ -177,7 +177,7 @@
         this.setCurrentName('0');
       }
 
-      this.$on('tabLabelChanged', this.calcPaneInstances.bind(null, true));
+      this.$on('tab-nav-update', this.calcPaneInstances.bind(null, true));
     },
 
     mounted() {