---
display: Range
family: Form
---

# Range

滑动输入条

## API

### Props

| 名称           | 说明                                                               | 类型            | 默认值 |
| :------------- | :----------------------------------------------------------------- | :-------------- | :----- |
| min            | 最小值                                                             | number          | 0      |
| max            | 最大值                                                             | number          | 100    |
| step           | 步长                                                               | number          | 1      |
| value          | 值                                                                 | number/number[] | 0      |
| count          | 拇指的个数, 1 或 2                                                 | number          | 1      |
| defaultValue   | 默认值                                                             | number/number[] | 0      |
| disabled       | 是否禁用                                                           | boolean         | false  |
| readOnly       | 只读模式                                                           | boolean         | false  |
| marks          | 需要显示的数值标签                                                 | object          | {}     |
| tooltipVisible | 是否显示气泡提示,`true`一直显示，`false`一直不显示，默认拖动时显示 | boolean         |        |
| onChange       | 拖动结束的回调                                                     | (value) => void | noop   |
| onMove         | 拖动过程的回调，尽量避免在这里 setState                            | (value) => void |        |

### CSS API

| 名称                               | 说明                                 |
| :--------------------------------- | :----------------------------------- |
| range                              | 最外层样式                           |
| range\_\_track                     | 轨道的样式                           |
| range--disabled\_\_track           | 禁用时轨道的样式                     |
| range\_\_track--selected           | 选中的轨道样式                       |
| range--disabled\_\_track--selected | 禁用时选中部分的样式                 |
| range\_\_thumb                     | 拇指的样式                           |
| range\_\_thumb--active             | 拖动时拇指的样式                     |
| range\_\_mark                      | 刻度线的样式                         |
| range--disabled\_\_mark            | 禁用时刻度线的样式                   |
| range\_\_mark--active              | 刻度线在选中范围的样式               |
| range--disabled\_\_mark--active    | 禁用状态下刻度线在选中范围的样式     |
| range\_\_label                     | 刻度线文案的样式                     |
| range--disabled\_\_label           | 禁用时刻度线文案的样式               |
| range\_\_label--active             | 刻度线文案在选中范围的样式           |
| range--disabled\_\_label--active   | 禁用状态下刻度线文案在选中范围的样式 |
| range\_\_tooltip                   | 气泡的样式                           |
| range\_\_arrow                     | 气泡箭头的样式                       |