From 0aa89aaec46ab38d05ad5389ef74553953040988 Mon Sep 17 00:00:00 2001
From: CodingOnStar <447357187@qq.com>
Date: Fri, 19 Aug 2022 10:32:19 +0800
Subject: [PATCH] =?UTF-8?q?fix(tab):=20=E4=BD=BF=E7=94=A8=E5=8E=9F?=
 =?UTF-8?q?=E7=94=9F=E5=B1=9E=E6=80=A7=E6=9B=BF=E6=8D=A2=E8=B6=85=E9=95=BF?=
 =?UTF-8?q?=E6=BB=9A=E5=8A=A8=E7=9A=84offset?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

#781
---
 src/tabs/tabs.ts   | 45 +++++++++++++++++++++++----------------------
 src/tabs/tabs.wxml |  2 ++
 2 files changed, 25 insertions(+), 22 deletions(-)

diff --git a/src/tabs/tabs.ts b/src/tabs/tabs.ts
index f6c805542..9993f4543 100644
--- a/src/tabs/tabs.ts
+++ b/src/tabs/tabs.ts
@@ -69,7 +69,8 @@ export default class Tabs extends SuperComponent {
     isScrollY: false,
     direction: 'X',
     animate: { duration: 0 },
-    offset: 0,
+    // offset: 0,
+    itemId: 'item0',
   };
 
   created() {
@@ -140,19 +141,19 @@ export default class Tabs extends SuperComponent {
     }
   }
 
-  calcScrollOffset(
-    containerWidth: number,
-    totalWidth: number,
-    targetLeft: number,
-    targetWidth: number,
-    offset: number,
-  ) {
-    if (offset + targetLeft > containerWidth / 2) {
-      const maxOffset = totalWidth - containerWidth;
-      return Math.min(Math.abs(containerWidth / 2 - targetLeft - offset - targetWidth / 2), maxOffset);
-    }
-    return 0;
-  }
+  // calcScrollOffset(
+  //   containerWidth: number,
+  //   totalWidth: number,
+  //   targetLeft: number,
+  //   targetWidth: number,
+  //   offset: number,
+  // ) {
+  //   if (offset + targetLeft > containerWidth / 2) {
+  //     const maxOffset = totalWidth - containerWidth;
+  //     return Math.min(Math.abs(containerWidth / 2 - targetLeft - offset - targetWidth / 2), maxOffset);
+  //   }
+  //   return 0;
+  // }
 
   setTrack() {
     if (!this.properties.showBottomLine) return;
@@ -175,15 +176,15 @@ export default class Tabs extends SuperComponent {
         }
 
         if (this.containerWidth) {
-          const offset = this.calcScrollOffset(
-            this.containerWidth,
-            rect.width * res.length,
-            rect.left,
-            rect.width,
-            this.data.offset,
-          );
+          // const offset = this.calcScrollOffset(
+          //   this.containerWidth,
+          //   rect.width * res.length,
+          //   rect.left,
+          //   rect.width,
+          //   this.data.offset,
+          // );
           this.setData({
-            offset,
+            itemId: `item${rect.dataset.index}`,
           });
         }
 
diff --git a/src/tabs/tabs.wxml b/src/tabs/tabs.wxml
index e1ee52593..4b5fdf660 100644
--- a/src/tabs/tabs.wxml
+++ b/src/tabs/tabs.wxml
@@ -16,12 +16,14 @@
         scroll-x="{{isScrollX}}"
         scroll-y="{{isScrollY}}"
         scroll-with-animation
+        scroll-into-view="{{itemId}}"
       >
         <view class="{{classPrefix}}__nav">
           <view
             wx:for="{{tabs}}"
             wx:key="index"
             data-index="{{index}}"
+            id="{{'item'+index}}"
             class="{{classPrefix}}__item {{prefix}}-class-item {{item.disabled ? (prefix + '-is-disabled') : '' }} {{currentIndex === index ? prefix + '-is-active ' + prefix + '-class-active' : ''}}"
             bind:tap="onTabTap"
           >