43 lines
		
	
	
		
			1006 B
		
	
	
	
		
			Markdown
		
	
	
			
		
		
	
	
			43 lines
		
	
	
		
			1006 B
		
	
	
	
		
			Markdown
		
	
	
<cn>
 | 
						|
#### 事件
 | 
						|
当 Slider 的值发生改变时,会触发 `onChange` 事件,并把改变后的值作为参数传入。在 `onmouseup` 时,会触发 `onAfterChange` 事件,并把当前值作为参数传入。
 | 
						|
</cn>
 | 
						|
 | 
						|
<us>
 | 
						|
#### Event
 | 
						|
The `onChange` callback function will fire when the user changes the slider's value.
 | 
						|
The `onAfterChange` callback function will fire when `onmouseup` fired.
 | 
						|
</us>
 | 
						|
 | 
						|
```html
 | 
						|
<template>
 | 
						|
  <div class="code-box-demo">
 | 
						|
    <a-slider :defaultValue="30" @change="onChange" @afterChange="onAfterChange" />
 | 
						|
    <a-slider range :step="10" :defaultValue="[20, 50]" @change="onChange" @afterChange="onAfterChange" />
 | 
						|
  </div>
 | 
						|
</template>
 | 
						|
<script>
 | 
						|
export default {
 | 
						|
  data() {
 | 
						|
    return {
 | 
						|
      disabled: false,
 | 
						|
    }
 | 
						|
  },
 | 
						|
  methods: {
 | 
						|
    onChange(value) {
 | 
						|
      console.log('change: ', value);
 | 
						|
    },
 | 
						|
    onAfterChange(value) {
 | 
						|
      console.log('afterChange: ', value);
 | 
						|
    }
 | 
						|
  },
 | 
						|
}
 | 
						|
</script>
 | 
						|
<style scoped>
 | 
						|
.code-box-demo .ant-slider {
 | 
						|
  margin-bottom: 16px;
 | 
						|
}
 | 
						|
</style>
 | 
						|
```
 | 
						|
 |