## Slider 滑塊
### 該文檔不再維護,新版文檔地址: [form-create 文檔](http://fc.gd8.top)
#### [在線預覽](https://jsrun.net/rehKp/edit)
#### 舉例:
```js
{
type:"slider",
field:"slider",
title:"滑塊",
value:[0,52],
props:{
"min": 0,
"max": 100,
"range": true,
}
}
```
#### maker快速生成:
```js
$formCreate.maker.slider('滑塊','slider',[0,52]).props({
"min": 0,
"max": 100,
"range": true,
"showTip":"always"
})
```
#### json 生成規則
```json
{
type:"slider",
field:"slider",
title:"滑塊",
value:[0,50], //滑塊選定的值。普通模式下，數據格式為數字，在雙滑塊模式下，數據格式為長度是2的數組，且每項都為數字
props:{
"min": 0, //最小值
"max": 100, //最大值
"step": 1, //步長，取值建議能被（max - min）整除
"disabled": false, //是否禁用滑塊
"range": true, //是否開啟雙滑塊模式
"showInput":false, //是否顯示數字輸入框，僅在單滑塊模式下有效
"showStops":true, //是否顯示間斷點，建議在 step 不密集時使用
"showTip":"hover", //提示的顯示控制，可選值為 hover（懸停，默認）、always（總是可見）、never（不可見）
"tipFormat":undefined, //Slider 會把當前值傳給 tip-format，并在 Tooltip 中顯示 tip-format 的返回值，若為 null，則隱藏 Tooltip
"inputSize":"small", //數字輸入框的尺寸，可選值為large、small、default或者不填，僅在開啟 show-input 時有效
},
validate:[]
}
```
#### 參數說明
##### 基本規則 rule:
| 字段名 | 說明 | 字段類型 | 是否必填 | 默認值 |
| :--- | :--- | :--- | :--- | :--- |
| type | 元素類型 | String | true | - |
| field | 字段名稱 | String | true | - |
| title | 字段別名 | String | true | - |
| value | 滑塊選定的值。普通模式下，數據格式為數字，在雙滑塊模式下，數據格式為長度是2的數組，且每項都為數字 | Number ,Array | false | - |
| props | 元素配置 | Object | false | - |
| event | 元素事件 | Object | false | - |
| validate | 驗證規則 | Array | false | - |
##### 元素配置 props:
| 字段名 | 說明 | 字段類型 | 是否必填 | 默認值 |
| :--- | :--- | :--- | :--- | :--- |
| min | 最小值 | Number | false | 0 |
| max | 最大值 | Number | false | 100 |
| step | 步長，取值建議能被（max - min）整除 | Number | false | 1 |
| disabled | 是否禁用滑塊 | Boolean | false | false |
| range | 是否開啟雙滑塊模式 | Boolean | false | false |
| showInput | 是否顯示數字輸入框，僅在單滑塊模式下有效 | Boolean | false | false |
| showStops | 是否顯示間斷點，建議在 step 不密集時使用 | Boolean | false | false |
| showTip | 提示的顯示控制，可選值為 hover（懸停，默認）、always（總是可見）、never（不可見） | String | false | 'hover' |
| tipFormat | Slider 會把當前值傳給 tip-format，并在 Tooltip 中顯示 tip-format 的返回值，若為 null，則隱藏 Tooltip | Function | false | - |
| inputSize | 數字輸入框的尺寸，可選值為large、small、default或者不填，僅在開啟 show-input 時有效 | String | false | 'default' |
##### 事件擴展 event:
| 事件名稱 | 說明 | 字段類型 | 是否必填 | 默認值 |
| :--- | :--- | :--- | :--- | :--- |
| change | 在松開滑動時觸發，返回當前的選值，在滑動過程中不會觸發 | Function | false | - |
| input | 滑動條數據變化時觸發，返回當前的選值，在滑動過程中實時觸發 | Function | false | - |
---
