chore: update demo

Author: anlyyao

packages/components/slider/__test__/__snapshots__/demo.test.js.snap

@@ -40,7 +40,7 @@ exports[`Slider Slider capsule demo works fine 1`] = `
           60,
         ]
       }}"
-      label="\${value}"
+      label="\${value}%"
       range="{{true}}"
       theme="capsule"
     />
@@ -95,7 +95,7 @@ exports[`Slider Slider disabled demo works fine 1`] = `
   >
     <t-slider
       disabled="{{true}}"
-      label="\${value}"
+      label="\${value}%"
       range="{{true}}"
       showExtremeValue="{{true}}"
       value="{{
@@ -140,7 +140,7 @@ exports[`Slider Slider label demo works fine 1`] = `
     class="wrapper"
   >
     <t-slider
-      label="\${value}"
+      label="\${value}%"
       value="{{35}}"
       bind:change="handleChange"
     />
@@ -160,7 +160,7 @@ exports[`Slider Slider label demo works fine 1`] = `
           60,
         ]
       }}"
-      label="\${value}"
+      label=""
       range="{{true}}"
       showExtremeValue="{{true}}"
     />
@@ -277,7 +277,7 @@ exports[`Slider Slider vertical demo works fine 1`] = `
     class="wrapper"
   >
     <t-slider
-      label="\${singlevalue}"
+      label="\${value}%"
       value="{{35}}"
       vertical="{{true}}"
       bind:change="handleSingleChange"
@@ -322,7 +322,7 @@ exports[`Slider Slider vertical demo works fine 1`] = `
     class="wrapper"
   >
     <t-slider
-      label="\${capsuleValue}"
+      label="\${value}%"
       theme="capsule"
       value="{{35}}"
       vertical="{{true}}"

packages/components/slider/_example/capsule/index.wxml

@@ -3,7 +3,7 @@
 
   <t-slider defaultValue="{{ [40, 60] }}" range theme="capsule" />
 
-  <t-slider defaultValue="{{ [40, 60] }}" range label="${value}" theme="capsule" />
+  <t-slider defaultValue="{{ [40, 60] }}" range label="${value}%" theme="capsule" />
 
   <t-slider defaultValue="{{60}}" marks="{{marks}}" step="{{20}}" theme="capsule" />
 

packages/components/slider/_example/disabled/index.wxml

@@ -1,7 +1,7 @@
 <t-slider value="{{35}}" disabled />
 
 <view class="wrapper">
-  <t-slider show-extreme-value label="${value}" value="{{ [40, 60] }}" range disabled />
+  <t-slider show-extreme-value label="${value}%" value="{{ [40, 60] }}" range disabled />
 </view>
 
 <view class="wrapper">

packages/components/slider/_example/label/index.js

@@ -1,6 +1,10 @@
 Component({
   data: {
     value: 35,
+    label(value, position) {
+      const symbols = { min: '%', max: '%', start: '%', end: '%' };
+      return `${value}${symbols[position]}`;
+    },
   },
 
   methods: {

packages/components/slider/_example/label/index.wxml

@@ -1,9 +1,9 @@
 <view class="wrapper">
-  <t-slider value="{{value}}" label="${value}" bind:change="handleChange"></t-slider>
+  <t-slider value="{{value}}" label="${value}%" bind:change="handleChange"></t-slider>
 </view>
 
 <view class="demo-desc">带数值双游标滑块</view>
 
 <view class="wrapper">
-  <t-slider show-extreme-value label="${value}" default-value="{{ [40, 60] }}" range />
+  <t-slider show-extreme-value label="{{label}}" default-value="{{ [40, 60] }}" range />
 </view>

packages/components/slider/_example/vertical/index.wxml

@@ -1,20 +1,14 @@
 <view class="demo-desc">单游标垂直滑块</view>
 <view class="wrapper">
-  <t-slider vertical value="{{singlevalue}}" label="${singlevalue}" bind:change="handleSingleChange" />
+  <t-slider vertical value="{{singlevalue}}" label="${value}%" bind:change="handleSingleChange" />
 </view>
 <view class="demo-desc">带刻度的双游标垂直滑块</view>
 <view class="wrapper">
   <t-slider vertical range defaultValue="{{ [20, 60] }}" marks="{{marks}}" step="{{20}}" />
 </view>
 <view class="demo-desc">胶囊型垂直滑块</view>
 <view class="wrapper">
-  <t-slider
-    vertical
-    value="{{capsuleValue}}"
-    label="${capsuleValue}"
-    theme="capsule"
-    bind:change="handleCapsuleChange"
-  />
+  <t-slider vertical value="{{capsuleValue}}" label="${value}%" theme="capsule" bind:change="handleCapsuleChange" />
 </view>
 <view class="demo-desc">带刻度的胶囊型垂直滑块</view>
 <view class="wrapper">