Sliders滑动条

author: 闫申申

定义

带展示当前数值的滑动条。

图片展示

Sliders 滑动条 - 图1

代码演示

  1. import Slider from 'pile/dist/components/slider'
  2. const {Sliders}= Slider
  3. 滑动 纯色:
  4. <Sliders
  5. upChangeBack={slidecb}
  6. defaultValue={4}
  7. min={0}
  8. max={10}
  9. titleBefore="自定义标题前 "
  10. titleAfter=" 自定义标题后"
  11. />
  12. 分段颜色展示:
  13. <Sliders
  14. upChangeBack={slidecb}
  15. colorStageGroup={[4]}
  16. colorGroup={["#f44336","#31c8a4"]}
  17. defaultValue={4}
  18. min={0}
  19. max={10}
  20. titleBefore="自定义标题前 "
  21. titleAfter=" 自定义标题后"
  22. />
  23. 禁止滑动:
  24. <Sliders
  25. defaultValue={6}
  26. min={0}
  27. max={10}
  28. disabled={true}
  29. titleBefore=""
  30. titleAfter=""
  31. />

属性

参数 描述 数据类型 默认值
defaultValue 默认数值 number 0
min 最小值 number 0
max 最大值 number 10
disabled 禁用状态 ,值为 true禁用滑动 bool false
upChangeBack 滑动回调函数 function null
titleBefore 标题前半部分(以数值为分界点)Sliders组件独有 string 自定义标题前
titleAfter 标题后半部分(以数值为分界点)Sliders组件独有 string 自定义标题后

原文: https://didi.github.io/pile.js/docs/2017/08/develop-components-slider-sliders.html