From 40eb8f02939407a6ba9409edda737342800c064a Mon Sep 17 00:00:00 2001
From: hdx <hdx@dcloud.io>
Date: Mon, 15 Jan 2024 13:55:27 +0800
Subject: [PATCH] =?UTF-8?q?swiper-list2:=20=E7=A7=BB=E9=99=A4$=E5=BC=80?=
 =?UTF-8?q?=E5=A4=B4=E7=9A=84=E5=8F=98=E9=87=8F=EF=BC=8C=E6=94=AF=E6=8C=81?=
 =?UTF-8?q?=20web?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/template/swiper-list2/swiper-list2.uvue | 33 +++++++++----------
 1 file changed, 15 insertions(+), 18 deletions(-)

diff --git a/pages/template/swiper-list2/swiper-list2.uvue b/pages/template/swiper-list2/swiper-list2.uvue
index 8b17cd5e..d5aa4505 100644
--- a/pages/template/swiper-list2/swiper-list2.uvue
+++ b/pages/template/swiper-list2/swiper-list2.uvue
@@ -39,10 +39,10 @@
     data() {
       return {
         swiperList: [] as SwiperViewItem[],
-        swiperIndex: -1,
-        $tabScrollView: null as null | UniElement,
-        $animationFinishIndex: 0,
-        $swiperWidth: 0
+        swiperIndex: 0,
+        tabScrollView: null as null | UniElement,
+        animationFinishIndex: 0,
+        swiperWidth: 0
       }
     },
     onLoad() {
@@ -53,9 +53,9 @@
       }
     },
     onReady() {
-      this.$tabScrollView = this.$refs['tabScroll'] as UniElement
-      this.$swiperWidth = (this.$refs["swiper"] as UniElement).getBoundingClientRect().width
-      this.setSwiperIndex(0, true)
+      this.tabScrollView = this.$refs['tabScroll'] as UniElement
+      this.swiperWidth = (this.$refs["swiper"] as UniElement).getBoundingClientRect().width
+      this.updateTabIndicator(this.swiperIndex, this.swiperIndex, 1)
     },
     methods: {
       onTabClick(index : number) {
@@ -65,9 +65,9 @@
         const offset_x = e.detail.dx
 
         // 计算当前索引并重置差异
-        const current_offset_x = offset_x % this.$swiperWidth
-        const current_offset_i = offset_x / this.$swiperWidth
-        const current_index = this.$animationFinishIndex + Math.floor(current_offset_i)
+        const current_offset_x = offset_x % this.swiperWidth
+        const current_offset_i = offset_x / this.swiperWidth
+        const current_index = this.animationFinishIndex + parseInt(current_offset_i + '')
 
         // 计算目标索引及边界检查
         let move_to_index = current_index
@@ -78,14 +78,14 @@
         }
 
         // 计算偏移百分比
-        const percentage = Math.abs(current_offset_x) / this.$swiperWidth
+        const percentage = Math.abs(current_offset_x) / this.swiperWidth
 
         // 通知更新指示线
         this.updateTabIndicator(current_index, move_to_index, percentage)
       },
       onSwiperAnimationfinish(e : SwiperAnimationFinishEvent) {
         this.setSwiperIndex(e.detail.current, true)
-        this.$animationFinishIndex = e.detail.current
+        this.animationFinishIndex = e.detail.current
       },
       setSwiperIndex(index : number, updateIndicator : boolean) {
         if (this.swiperIndex == index) {
@@ -99,8 +99,7 @@
         }
       },
       updateTabIndicator(current_index : number, move_to_index : number, percentage : number) {
-        // TODO 0.0 != 0
-        if (percentage.toDouble() == 0.0) {
+        if (percentage == 0) {
           return
         }
 
@@ -122,10 +121,8 @@
 
         // 滚动到水平中心位置
         const target_x = lerpNumber(current_node.offsetLeft, move_to_node.offsetLeft, percentage)
-        const center_x = target_x + move_to_node.offsetWidth / 2 - this.$swiperWidth / 2
-        if(this.$tabScrollView !== null){
-          this.$tabScrollView!.scrollLeft = center_x
-        }
+        const center_x = target_x + move_to_node.offsetWidth / 2 - this.swiperWidth / 2
+        this.tabScrollView!.scrollLeft = center_x
       }
     }
   }
-- 
GitLab