From 505866728a8894230e5a7b54a3ec02a0a388df58 Mon Sep 17 00:00:00 2001
From: hdx <hdx@dcloud.io>
Date: Wed, 30 Aug 2023 14:16:33 +0800
Subject: [PATCH] =?UTF-8?q?slider-100:=20=E7=82=B9=E5=87=BB=E6=97=B6?=
 =?UTF-8?q?=E6=9B=B4=E6=96=B0=E5=85=B6=E5=AE=83=20slider?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/component/slider-100/slider-100.uvue | 29 +++++++++++++---------
 1 file changed, 17 insertions(+), 12 deletions(-)

diff --git a/pages/component/slider-100/slider-100.uvue b/pages/component/slider-100/slider-100.uvue
index bade12ce..551a7993 100644
--- a/pages/component/slider-100/slider-100.uvue
+++ b/pages/component/slider-100/slider-100.uvue
@@ -6,19 +6,19 @@
     <view class="flex-row">
       <view class="flex-fill">
         <slider ref="slider1" v-for="(_, index1) in 25" :key="index1" class="slider" @changing="sliderChanging"
-          :value="sliderValue" :block-size="20" :show-value="true" />
+          @change="sliderChange" :value="sliderValue" :block-size="20" :show-value="true" />
       </view>
       <view class="flex-fill">
         <slider ref="slider2" v-for="(_, index2) in 25" :key="index2" class="slider" @changing="sliderChanging"
-          :value="sliderValue" :block-size="20" :show-value="true" />
+          @change="sliderChange" :value="sliderValue" :block-size="20" :show-value="true" />
       </view>
       <view class="flex-fill">
         <slider ref="slider3" v-for="(_, index3) in 25" :key="index3" class="slider" @changing="sliderChanging"
-          :value="sliderValue" :block-size="20" :show-value="true" />
+          @change="sliderChange" :value="sliderValue" :block-size="20" :show-value="true" />
       </view>
       <view class="flex-fill">
         <slider ref="slider4" v-for="(_, index4) in 25" :key="index4" class="slider" @changing="sliderChanging"
-          :value="sliderValue" :block-size="20" :show-value="true" />
+          @change="sliderChange" :value="sliderValue" :block-size="20" :show-value="true" />
       </view>
     </view>
     <!-- #ifdef APP -->
@@ -35,28 +35,33 @@
       }
     },
     methods: {
+      sliderChange(e : SliderChangeEvent) {
+        this.updateSliderValue(e.detail.value)
+      },
       sliderChanging(e : SliderChangeEvent) {
-        // this.sliderValue = e.detail.value
+        this.updateSliderValue(e.detail.value)
+      },
+      updateSliderValue(value : Number) {
+        // this.sliderValue = value
 
         // TODO 跳过vue框架，直接修改原生组件
-        const sliderValue = e.detail.value;
         (this.$refs["slider1"]! as ComponentPublicInstance[]).forEach((item) => {
-          item.$data["$sliderValue"] = sliderValue
+          item.$data["$sliderValue"] = value
           item.$callMethod("_onRender")
         });
         (this.$refs["slider2"]! as ComponentPublicInstance[]).forEach((item) => {
-          item.$data["$sliderValue"] = sliderValue
+          item.$data["$sliderValue"] = value
           item.$callMethod("_onRender")
         });
         (this.$refs["slider3"]! as ComponentPublicInstance[]).forEach((item) => {
-          item.$data["$sliderValue"] = sliderValue
+          item.$data["$sliderValue"] = value
           item.$callMethod("_onRender")
         });
         (this.$refs["slider4"]! as ComponentPublicInstance[]).forEach((item) => {
-          item.$data["$sliderValue"] = sliderValue
+          item.$data["$sliderValue"] = value
           item.$callMethod("_onRender")
         });
-      },
+      }
     },
   }
 </script>
@@ -77,4 +82,4 @@
   .slider {
     margin: 1px 0.5px;
   }
-</style>
\ No newline at end of file
+</style>
-- 
GitLab