feat(slider): add dual thumb mode for slider (#7175)

* feat(slider): add dual thumb mode for slider

* chore: remove comment

* fix: optimize code via CR

src/slider/demo/index.vue

@@ -5,20 +5,24 @@
     </demo-block>
 
     <demo-block :title="t('title2')">
-      <van-slider v-model="value2" :min="-50" :max="50" @change="onChange" />
+      <van-slider range v-model="value2" @change="onChange" />
     </demo-block>
 
     <demo-block :title="t('title3')">
-      <van-slider v-model="value3" disabled />
+      <van-slider v-model="value3" :min="-50" :max="50" @change="onChange" />
     </demo-block>
 
     <demo-block :title="t('title4')">
-      <van-slider v-model="value4" :step="10" @change="onChange" />
+      <van-slider v-model="value4" disabled />
+    </demo-block>
+
+    <demo-block :title="t('title5')">
+      <van-slider v-model="value5" :step="10" @change="onChange" />
     </demo-block>
 
     <demo-block :title="t('customStyle')">
       <van-slider
-        v-model="value5"
+        v-model="value6"
         bar-height="4px"
         active-color="#ee0a24"
         @change="onChange"
@@ -26,16 +30,22 @@
     </demo-block>
 
     <demo-block :title="t('customButton')">
-      <van-slider v-model="value6" active-color="#ee0a24">
+      <van-slider v-model="value7" active-color="#ee0a24">
         <template #button>
-          <div class="custom-button">{{ value6 }}</div>
+          <div class="custom-button">{{ value7 }}</div>
         </template>
       </van-slider>
     </demo-block>
 
     <demo-block v-if="!isWeapp" :title="t('vertical')">
       <div :style="{ height: '120px', paddingLeft: '30px' }">
-        <van-slider v-model="value7" vertical @change="onChange" />
+        <van-slider v-model="value8" vertical @change="onChange" />
+      </div>
+    </demo-block>
+
+    <demo-block v-if="!isWeapp" :title="t('vertical2')">
+      <div :style="{ height: '120px', paddingLeft: '30px' }">
+        <van-slider v-model="value9" range vertical @change="onChange" />
       </div>
     </demo-block>
   </demo-section>
@@ -46,35 +56,41 @@ export default {
   i18n: {
     'zh-CN': {
       title1: '基础用法',
-      title2: '指定选择范围',
-      title3: '禁用',
-      title4: '指定步长',
+      title2: '双滑块',
+      title3: '指定选择范围',
+      title4: '禁用',
+      title5: '指定步长',
       customStyle: '自定义样式',
       customButton: '自定义按钮',
       text: '当前值：',
       vertical: '垂直方向',
+      vertical2: '垂直方向，双滑块',
     },
     'en-US': {
       title1: 'Basic Usage',
-      title2: 'Range',
-      title3: 'Disabled',
-      title4: 'Step size',
+      title2: 'Dual thumb mode',
+      title3: 'Range',
+      title4: 'Disabled',
+      title5: 'Step size',
       customStyle: 'Custom Style',
       customButton: 'Custom Button',
       text: 'Current value: ',
       vertical: 'Vertical',
+      vertical2: 'Vertical, Dual thumb mode',
     },
   },
 
   data() {
     return {
       value1: 50,
-      value2: 0,
-      value3: 50,
+      value2: [20, 60],
+      value3: 0,
       value4: 50,
       value5: 50,
       value6: 50,
       value7: 50,
+      value8: 50,
+      value9: [20, 60],
     };
   },