|
|
|
@ -17,8 +17,8 @@ The `onChange` callback function will fire when the user changes the slider's va
|
|
|
|
|
|
|
|
|
|
<template> |
|
|
|
|
<div class="code-box-demo"> |
|
|
|
|
<a-slider v-model:value="value1" @afterChange="onAfterChange" /> |
|
|
|
|
<a-slider v-model:value="value2" range :step="10" @afterChange="onAfterChange" /> |
|
|
|
|
<a-slider v-model:value="value1" @change="onChange" @afterChange="onAfterChange" /> |
|
|
|
|
<a-slider v-model:value="value2" range :step="10" @change="onChange" @afterChange="onAfterChange" /> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
<script lang="ts" setup> |
|
|
|
@ -26,6 +26,10 @@ import { ref } from 'vue';
|
|
|
|
|
const value1 = ref<number>(30); |
|
|
|
|
const value2 = ref<[number, number]>([20, 50]); |
|
|
|
|
|
|
|
|
|
const onChange = (value: number) => { |
|
|
|
|
console.log('onChange: ', value); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
const onAfterChange = (value: number) => { |
|
|
|
|
console.log('afterChange: ', value); |
|
|
|
|
}; |
|
|
|
|