滑动选择器
属性 | 类型 | 默认值 | 必填 | 说明 |
---|---|---|---|---|
min | number | 0 | 最小值 | |
max | number | 100 | 最大值 | |
step | number | 1 | 步长,取值必须大于 0,并且可被(max - min)整除 | |
disabled | boolean | false | 是否禁用 | |
value | number | 0 | 当前取值 | |
active-color | string | #1aad19 | 已选择的颜色 | |
background-color | string | #e9e9e9 | 背景条的颜色 | |
block-size | number | 28 | 滑块的大小,取值范围为 12 - 28 | |
block-color | string | #ffffff | 滑块的颜色 | |
show-value | boolean | false | 是否显示当前 value | |
bindchange | eventhandle | 完成一次拖动后触发的事件,event.detail = {value} | ||
bindchanging | eventhandle | 拖动过程中触发的事件,event.detail = {value} |
<view class="page-section page-section-gap"> <view class="progress-box"> <progress percent="20" show-info stroke-width="3"/> </view> <view class="progress-box"> <progress percent="40" active stroke-width="3" /> <icon class="progress-cancel" type="cancel"></icon> </view> <view class="progress-box"> <progress percent="60" active stroke-width="3" /> </view> <view class="progress-box"> <progress percent="80" color="#10AEFF" active stroke-width="3" /> </view> </view>