slider

基础库 1.0.0 开始支持，低版本需做兼容处理。

滑动选择器。

属性类型默认值必填说明最低版本minnumber0否最小值1.0.0maxnumber100否最大值1.0.0stepnumber1否步长，取值必须大于 0，并且可被(max - min)整除1.0.0disabledbooleanfalse否是否禁用1.0.0valuenumber0否当前取值1.0.0colorcolor#e9e9e9否背景条的颜色（请使用 backgroundColor）1.0.0selected-colorcolor#1aad19否已选择的颜色（请使用 activeColor）1.0.0activeColorcolor#1aad19否已选择的颜色1.0.0backgroundColorcolor#e9e9e9否背景条的颜色1.0.0block-sizenumber28否滑块的大小，取值范围为 12 - 281.9.0block-colorcolor#ffffff否滑块的颜色1.9.0show-valuebooleanfalse否是否显示当前 value1.0.0bindchangeeventhandle 否完成一次拖动后触发的事件，event.detail = {value}1.0.0bindchangingeventhandle 否拖动过程中触发的事件，event.detail = {value}1.7.0

示例代码

在开发者工具中预览效果

<view class="section section_gap"> <text class="section__title">设置step</text> <slider bindchange="slider2change" step="10" /> </view> <view class="section section_gap"> <text class="section__title">显示当前value</text> <slider bindchanging="slider3change" show-value block-size="28" block-color="#19A15F" /> </view> <view class="section section_gap"> <text class="section__title">设置最小/最大值</text> <slider value='80' bindchange="slider4change" min="50" max="200" show-value backgroundColor="#DD4F43" activeColor="#4C8CF5" block-size="12" block-color="#19A15F" /> </view> Page({ data: { }, slider4change:function(e) { console.log(e); }, slider3change: function (e) { console.log(e); }, slider2change: function (e) { console.log(e); }, })

文本内容来自 ：https://developers.weixin.qq.com/miniprogram/dev/component/slider.html