Blame view

test/routers/slider.vue 962 Bytes
4ec205b6   梁灏   add Tag UI
1
  <template>
69576f47   梁灏   add Slider component
2
3
      <div style="width: 400px;margin:100px;">
          {{ value }}
5709f32e   梁灏   Slider support hi...
4
5
          <Slider @on-change="change"></Slider>
          <Slider :value="40" :tip-format="format"></Slider>
41d90ccf   梁灏   Slider can show s...
6
          <Slider :value.sync="value" show-input show-stops range @on-change="change" :step="13"></Slider>
69576f47   梁灏   add Slider component
7
8
9
          <!--<Slider :max="10"></Slider>-->
          <!--<Slider :step="13"></Slider>-->
          <!--<Slider :step="13" :max="60"></Slider>-->
b79b53ea   梁灏   Icon add color prop
10
          <Icon type="checkmark-circled" size="40" color="#f60"></Icon>
69576f47   梁灏   add Slider component
11
      </div>
4ec205b6   梁灏   add Tag UI
12
13
  </template>
  <script>
b79b53ea   梁灏   Icon add color prop
14
      import { Slider, Icon } from 'iview';
4ec205b6   梁灏   add Tag UI
15
      export default {
b79b53ea   梁灏   Icon add color prop
16
          components: { Slider, Icon },
36febc3c   梁灏   add Slider
17
18
          data () {
              return {
69576f47   梁灏   add Slider component
19
                  value: [20, 50]
36febc3c   梁灏   add Slider
20
21
              }
          },
4ec205b6   梁灏   add Tag UI
22
          methods: {
36febc3c   梁灏   add Slider
23
              format (val) {
5709f32e   梁灏   Slider support hi...
24
                  return null;
36febc3c   梁灏   add Slider
25
                  return `进度:${val}%`
69576f47   梁灏   add Slider component
26
27
              },
              change (data) {
5709f32e   梁灏   Slider support hi...
28
  //                console.log(data)
9dde24b6   梁灏   add LoadingBar co...
29
              }
4ec205b6   梁灏   add Tag UI
30
31
          }
      }
e355dd49   梁灏   add Select Component
32
  </script>