滑动条(vSlider)

单组件引入

import <name> from ‘vucc/slider’;

示例


滑动条 slider:





固定点:






代码 V

<v-slider min="100" max="1000" v-model="sliderValue" :text="'px'"></v-slider>
<v-slider v-model="sliderValue2" :value-list="sliderValueList"></v-slider>


// slider
sliderValue: 10,
sliderValue2: 50,
// 固定点阵的滑动输入条
sliderValueList: [{
label: '0ms',
value: 0
}, {
label: '25ms',
value: 25
}, {
label: '50ms',
value: 50
}, {
label: '100ms',
value: 100
}, {
label: '200ms',
value: 200
}, {
label: '400ms',
value: 400
}, {
label: '1s',
value: 1000
}, {
label: '2s',
value: 2000
}]



属性

参数 说明 类型 可选值 默认值
max 拖拽的最大值 String - 100
min 拖拽的最小值 String - 0
text 拖拽值的附加文本 String - -
type 当type为percent的时,将附加text = % String - -
value 当前滑动条的值 String/Number - 100
isDisabled 拖拽的最大值 Boolean - false
valueList 固定点的点阵渲染列表,如果传入,则按照固定点阵进行拖拽 Array - []