Range范围输入模块
Range模块可实现单滑块和双滑块的范围选择，支持冻结功能，支持使用标尺，完美替代原生range组件。
简单使用
对div或input节点使用ax-range属性即可创建一个普通的0~100的范围滑块。
使用id+new形式也可以创建范围滑块。
递增和递减
如果需要显示递增和递减按钮可设置参数button:true或button.enable:true。
参数button原本是一个对象，除了enable属性，还有如下如下：
- step：步进，默认值为1，与参数step相同
- decrease：递减按钮的html内容，默认为减号图标
- increase：递增按钮的html内容，默认为加号图标
基础配置
| 属性 |
类型 |
默认值 |
说明 |
| name |
string |
'' |
隐藏input的name属性 |
| step |
number |
1 |
滑块步进值 |
| max |
number |
100 |
最大值 |
| min |
number |
0 |
最小值 |
| value |
number/array |
0 |
初始值 |
| axis |
'x'/'y' |
'x' |
滑动方向 |
| disabled |
boolean |
false |
是否禁用 |
显示配置
| 属性 |
类型 |
默认值 |
说明 |
| size |
'sm'/'md'/'lg' |
'md' |
滑块尺寸 |
| full |
boolean |
false |
是否横向铺满 |
| classes |
string |
'' |
追加样式类 |
| limitShow |
boolean |
true |
是否显示极限值气泡 |
| tipShow |
boolean |
true |
是否显示滑块气泡 |
多滑块配置
| 属性 |
类型 |
默认值 |
说明 |
| multiple |
boolean |
false |
是否启用双滑块 |
| locked |
boolean |
false |
是否锁定滑块间距 |
| separator |
string |
'~' |
input值分隔符 |
| hyphen |
string |
'~' |
气泡值连接符 |
范围配置
| 属性 |
类型 |
默认值 |
说明 |
| fence.enable |
boolean |
false |
是否启用有效范围 |
| fence.min |
number |
0 |
有效范围最小值 |
| fence.max |
number |
100 |
有效范围最大值 |
按钮配置
| 属性 |
类型 |
默认值 |
说明 |
| button.enable |
boolean |
false |
是否启用增减按钮 |
| button.decrease |
string |
'' |
减少按钮HTML |
| button.increase |
string |
'' |
增加按钮HTML |
| keyboard |
boolean |
false |
是否支持键盘操作 |
标尺配置
| 属性 |
类型 |
默认值 |
说明 |
| ruler.enable |
boolean |
false |
是否显示标尺 |
| ruler.majorEqual |
number |
4 |
大刻度等分数 |
| ruler.minorEqual |
number/'auto' |
'auto' |
小刻度等分数 |
| ruler.labels |
array |
[] |
大刻度标签 |
结果显示配置
| 属性 |
类型 |
默认值 |
说明 |
| result.enable |
boolean |
false |
是否显示结果 |
| result.target |
string/null |
null |
结果显示容器选择器 |
回调函数
| 属性 |
类型 |
默认值 |
说明 |
| onSet |
function |
null |
设置新值后回调 |
| onToStart |
function |
null |
到达最小值回调 |
| onToEnd |
function |
null |
到达最大值回调 |
| onEnabled |
function |
null |
启用后回调 |
| onDisabled |
function |
null |
禁用后回调 |
| onRestored |
function |
null |
恢复初始值回调 |
