[bugfix] Tabs：修复开启animated属性时导致的滚动问题 (#2238)

packages/tabs/index.vue

@@ -44,7 +44,6 @@
       :class="b('content')"
     >
       <div
-        v-show="computedWidth !== 0"
         :class="b('track')"
         :style="trackStyle"
       >
@@ -112,8 +111,7 @@ export default create({
         resize: false,
         sticky: false,
         swipeable: false
-      },
-      computedWidth: 0
+      }
     };
   },
 
@@ -149,18 +147,18 @@ export default create({
     trackStyle() {
       const {
         curActive,
-        computedWidth = 0,
-        tabs,
         animated
       } = this;
-      if (!animated) return {};
 
-      const offset = -1 * computedWidth * curActive;
-      return {
-        width: `${computedWidth * tabs.length}px`,
-        transitionDuration: `${this.duration}s`,
-        transform: `translateX(${offset}px)`
+      const trackStyle = {
+        left: `${-1 * curActive * 100}%`
       };
+
+      if (animated) {
+        trackStyle.transitionDuration = `${this.duration}s`;
+      }
+
+      return trackStyle;
     }
   },
 
@@ -203,7 +201,6 @@ export default create({
   mounted() {
     this.correctActive(this.active);
     this.setLine();
-    this.setWidth();
 
     this.$nextTick(() => {
       this.handlers(true);
@@ -227,13 +224,6 @@ export default create({
   },
 
   methods: {
-    setWidth() {
-      if (this.$el) {
-        const rect = this.$el.getBoundingClientRect() || {};
-        this.computedWidth = rect.width;
-      }
-    },
-
     // whether to bind sticky listener
     handlers(bind) {
       const { events } = this;