uni-app 区间选择滑块
说明:目前支持平台有APP、微信小程序、H5,其他平台理论上支持。
属性名 | 类型 | 默认值 | 说明 |
---|---|---|---|
width | Number | 750 | 组件宽度(rpx) |
height | Number | 100 | 组件高度(rpx) |
block-size | Number | 50 | 滑块大小(rpx) |
bar-height | Number | 10 | 进度条高度(rpx) |
background-color | String | #e9e9e9 | 进度条背景色 |
active-color | String | #1aad19 | 已选择的颜色 |
min | Number | 0 | 最小值 |
max | Number | 100 | 最大值 |
values | Array | [0,100] | 当前区间值 |
step | Number | 1 | 步长值 |
liveMode | Boolean | true | 是否即时刷新数值,默认true |
@rangechange | EventHandle | 完成一次拖动后触发的事件,event.detail = {minValue: value1,maxValue:value2, originalValue:value3} |
修改自:https://github.com/Money888/wechat-rangeslider
[优化] 增加拖动时圆点变大的效果
[优化] 将所有upx替换为rpx
[修复] 因为设置step,导致拖动会有偏移的bug
[修复] 修复使用step时,可能会遇到精度问题,达不到max值
[修复] 修复使用min大于0时,会跳动的bug