Skip to content

Slider 滑块

slider

规则

滑块

js
{
    type: 'slider',
    title: '滑块',
    field: 'slider',
    value: 50,
    props: {
        disabled: false,
    }
}

双滑块

js
{
    type: 'slider',
    title: '双滑块',
    field: 'slider2',
    value: [30, 70],
    props: {
        range: true,
    }
}

参考:Vant_Slider

value :Number | Array

Props

参数说明类型默认值
max最大值number | string100
min最小值number | string0
step步长number | string1
bar-height进度条高度,默认单位为 pxnumber | string2px
button-size滑块按钮大小,默认单位为 pxnumber | string24px
active-color进度条激活态颜色string#1989fa
inactive-color进度条非激活态颜色string#e5e5e5
range是否开启双滑块模式booleanfalse
reverse是否将进度条反转booleanfalse
disabled是否禁用滑块booleanfalse
readonly是否为只读状态,只读状态下无法修改滑块的值booleanfalse
vertical是否垂直展示booleanfalse

Events

事件名说明回调参数
change进度变化且结束拖动后触发value: number
drag-start开始拖动时触发event: TouchEvent
drag-end结束拖动时触发event: TouchEvent

FormCreate 是一个开源项目,基于 MIT 许可证发布,欢迎个人和企业用户免费使用