ant-design/components/slider/demo/event.md

40 lines
880 B
Markdown
Raw Normal View History

2016-03-31 09:40:55 +08:00
---
order: 4
2016-11-21 16:37:04 +08:00
title:
zh-CN: 事件
2016-07-21 10:15:00 +08:00
en-US: Event
2016-03-31 09:40:55 +08:00
---
2015-11-18 16:56:22 +08:00
## zh-CN
2015-12-24 09:54:59 +08:00
当 Slider 的值发生改变时,会触发 `onChange` 事件,并把改变后的值作为参数传入。在 `onmouseup` 时,会触发 `onAfterChange` 事件,并把当前值作为参数传入。
2015-11-18 16:56:22 +08:00
## en-US
2019-05-07 14:57:32 +08:00
The `onChange` callback function will fire when the user changes the slider's value. The `onAfterChange` callback function will fire when `onmouseup` fired.
2019-05-07 14:57:32 +08:00
```jsx
2015-11-18 16:56:22 +08:00
import { Slider } from 'antd';
2016-11-21 16:37:04 +08:00
function onChange(value) {
console.log('onChange: ', value);
}
function onAfterChange(value) {
console.log('onAfterChange: ', value);
2015-11-18 16:56:22 +08:00
}
export default () => (
<>
2016-11-21 16:37:04 +08:00
<Slider defaultValue={30} onChange={onChange} onAfterChange={onAfterChange} />
2019-05-07 14:57:32 +08:00
<Slider
range
step={10}
defaultValue={[20, 50]}
onChange={onChange}
onAfterChange={onAfterChange}
/>
</>
2016-11-21 16:37:04 +08:00
);
2019-05-07 14:57:32 +08:00
```