<script>
export default {
    components: {},
    data() {
        return{
            min: 50,
            max: 500,
            step: 50,
            type: 'kvm',
            count: 50,
            disabled: false,
            sliderChange($event) {
                this.count = $event;
            },
            slider($event){
                console.log($event)
            },
            change: function() {
                this.type = this.type === 'kvm' ? 'xen' : 'kvm'
                this.min = this.type === 'kvm' ? 50 : 1
                this.max = this.type === 'kvm' ? 500 : 20
                this.step = this.type === 'kvm' ? 50 : 1
                this.count = this.type === 'kvm' ? 50 : 20
                this.disabled = this.type === 'xen'
            }
        }
    }
}
</script>
# Slider 滑动条
进行滑动的滑动条

## 基本用法
由于max值与step必须为倍数关系，因此如果min，max值不是倍数，max值会默认减到邻近max值对应倍数。
如min：1，max10，step：2，可跳转值为1,3,5,7,9,但是max是10，且不能选到10，会默认改到邻近最大值9。
:::demo 使用`f-icon`嵌入图标
````html

<efly-slider v-model="count" width="360px" :min="min" :max="max" :step="step" :disabled="disabled"></efly-slider>


:::

## 参数说明
| 参数      | 说明    | 类型      | 可选值       | 默认值   |
|---------- |-------- |---------- |-------------  |-------- |
| value     | 当前值   | String  |     —        |    0     |
| width     | 宽度     | String  |     —        |    —     |
| min       | 最小值   | Number  |     —        |    0     |
| max       | 最大值   | Number  |     —        |    500   |
| step      | 步长     | Number  |     —        |    1     |

## 事件
| 事件名称      | 说明    | 回调参数   
|---------- |-------- |---------- |
| change    | 点击事件   | 当前value值  |

