微信小程序微信小程序开发者微信小程序开发

小程序:滑动选中器 slider

2018-06-14  本文已影响16人  Mccc_

代码Github地址

一. 属性说明

属性名 类型 默认值 说明
min Number 0 最小值
max Number 100 最大值
value Number 0 当前取值
step Number 1 步长,取值必须大于 0,并且可被(max - min)整除
disabled Boolean false 是否禁用
block-size Number 28 滑块的大小,取值范围为 12 - 28
block-color Color #ffffff 滑块的颜色
show-value Boolean false 是否显示当前 value
backgroundColor color #e9e9e9 背景条的颜色
activeColor color #1aad19 已选择的颜色
bindchange EventHandle 完成一次拖动后触发的事件,event.detail = {value: value}
bindchanging EventHandle 拖动过程中触发的事件,event.detail = {value: value}

二. 代码部分

<slider value="{{value}}" backgroundColor="gray" activeColor="red" block-size="12"show-value bindchange="change" bindchanging="changing"></slider>
Page({
  data: {
    value:50
  },
  change: function (event) {
    console.log(event.detail.value);
  },
  changing: function (event) {
    console.log(event.detail.value);
  }
})
上一篇 下一篇

猜你喜欢

热点阅读