🆙 support Slider[reverse]

close #4763
close #18639
This commit is contained in:
afc163 2019-09-06 16:35:13 +08:00 committed by 偏右
parent 2e5928450d
commit 96a9583bf8
4 changed files with 50 additions and 1 deletions

View File

@ -0,0 +1,47 @@
---
order: 8
title:
zh-CN: 反向
en-US: Reverse
---
## zh-CN
设置 `reverse` 可以将滑动条置反。
## en-US
Using `reverse` to render slider reversely.
```jsx
import { Slider, Switch } from 'antd';
class Demo extends React.Component {
state = {
reverse: true,
};
handleReverseChange = reverse => {
this.setState({ reverse });
};
render() {
const { reverse } = this.state;
return (
<div>
<Slider defaultValue={30} reverse={reverse} />
<Slider range defaultValue={[20, 50]} reverse={reverse} />
Reversed: <Switch size="small" checked={reverse} onChange={this.handleReverseChange} />
</div>
);
}
}
ReactDOM.render(<Demo />, mountNode);
```
<style>
.code-box-demo .ant-slider {
margin-bottom: 16px;
}
</style>

View File

@ -23,6 +23,7 @@ To input a value in a range.
| max | The maximum value the slider can slide to | number | 100 | |
| min | The minimum value the slider can slide to. | number | 0 | |
| range | dual thumb mode | boolean | false | |
| reverse | reverse the component | boolean | false | 3.24.0 |
| step | The granularity the slider can step through values. Must greater than 0, and be divided by (max - min) . When `marks` no null, `step` can be `null`. | number\|null | 1 | |
| tipFormatter | Slider will pass its value to `tipFormatter`, and display its value in Tooltip, and hide Tooltip when return value is null. | Function\|null | IDENTITY | |
| value | The value of slider. When `range` is `false`, use `number`, otherwise, use `[number, number]` | number\|number\[] | |

View File

@ -24,6 +24,7 @@ title: Slider
| max | 最大值 | number | 100 | |
| min | 最小值 | number | 0 | |
| range | 双滑块模式 | boolean | false | |
| reverse | 反向坐标轴 | boolean | false | 3.24.0 |
| step | 步长,取值必须大于 0并且可被 (max - min) 整除。当 `marks` 不为空对象时,可以设置 `step``null`,此时 Slider 的可选值仅有 marks 标出来的部分。 | number\|null | 1 | |
| tipFormatter | Slider 会把当前值传给 `tipFormatter`,并在 Tooltip 中显示 `tipFormatter` 的返回值,若为 null则隐藏 Tooltip。 | Function\|null | IDENTITY | |
| value | 设置当前取值。当 `range``false` 时,使用 `number`,否则用 `[number, number]` | number\|number\[] | | |

View File

@ -76,7 +76,7 @@
"rc-progress": "~2.5.0",
"rc-rate": "~2.5.0",
"rc-select": "~9.2.0",
"rc-slider": "~8.6.11",
"rc-slider": "~8.7.1",
"rc-steps": "~3.5.0",
"rc-switch": "~1.9.0",
"rc-table": "~6.8.2",