Netfan
12 months ago
committed by
GitHub
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with
30 additions and
6 deletions
-
docs/src/components/common-ui/vben-count-to-animator.md
-
packages/@core/ui-kit/shadcn-ui/src/components/count-to-animator/count-to-animator.vue
|
|
@ -42,11 +42,18 @@ outline: deep |
|
|
| transition | 动画效果 | `string` | `linear` | |
|
|
| transition | 动画效果 | `string` | `linear` | |
|
|
| decimals | 保留小数点位数 | `number` | `0` | |
|
|
| decimals | 保留小数点位数 | `number` | `0` | |
|
|
|
|
|
|
|
|
### Methods |
|
|
### Events |
|
|
|
|
|
|
|
|
|
|
|
| 事件名 | 描述 | 类型 | |
|
|
|
|
|
| -------------- | -------------- | -------------- | |
|
|
|
|
|
| started | 动画已开始 | `()=>void` | |
|
|
|
|
|
| finished | 动画已结束 | `()=>void` | |
|
|
|
|
|
| ~~onStarted~~ | ~~动画已开始~~ | ~~`()=>void`~~ | |
|
|
|
|
|
| ~~onFinished~~ | ~~动画已结束~~ | ~~`()=>void`~~ | |
|
|
|
|
|
|
|
|
以下事件,只有在 `useVbenModal({onCancel:()=>{}})` 中传入才会生效。 |
|
|
### Methods |
|
|
|
|
|
|
|
|
| 事件名 | 描述 | 类型 | |
|
|
| 方法名 | 描述 | 类型 | |
|
|
| ------ | ------------ | ---------- | |
|
|
| ------ | ------------ | ---------- | |
|
|
| start | 开始执行动画 | `()=>void` | |
|
|
| start | 开始执行动画 | `()=>void` | |
|
|
| reset | 重置 | `()=>void` | |
|
|
| reset | 重置 | `()=>void` | |
|
|
|
|
|
@ -37,7 +37,18 @@ const props = withDefaults(defineProps<Props>(), { |
|
|
useEasing: true, |
|
|
useEasing: true, |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
const emit = defineEmits(['onStarted', 'onFinished']); |
|
|
const emit = defineEmits<{ |
|
|
|
|
|
finished: []; |
|
|
|
|
|
/** |
|
|
|
|
|
* @deprecated 请使用{@link finished}事件 |
|
|
|
|
|
*/ |
|
|
|
|
|
onFinished: []; |
|
|
|
|
|
/** |
|
|
|
|
|
* @deprecated 请使用{@link started}事件 |
|
|
|
|
|
*/ |
|
|
|
|
|
onStarted: []; |
|
|
|
|
|
started: []; |
|
|
|
|
|
}>(); |
|
|
|
|
|
|
|
|
const source = ref(props.startVal); |
|
|
const source = ref(props.startVal); |
|
|
const disabled = ref(false); |
|
|
const disabled = ref(false); |
|
|
@ -73,8 +84,14 @@ function run() { |
|
|
outputValue = useTransition(source, { |
|
|
outputValue = useTransition(source, { |
|
|
disabled, |
|
|
disabled, |
|
|
duration: props.duration, |
|
|
duration: props.duration, |
|
|
onFinished: () => emit('onFinished'), |
|
|
onFinished: () => { |
|
|
onStarted: () => emit('onStarted'), |
|
|
emit('finished'); |
|
|
|
|
|
emit('onFinished'); |
|
|
|
|
|
}, |
|
|
|
|
|
onStarted: () => { |
|
|
|
|
|
emit('started'); |
|
|
|
|
|
emit('onStarted'); |
|
|
|
|
|
}, |
|
|
...(props.useEasing |
|
|
...(props.useEasing |
|
|
? { transition: TransitionPresets[props.transition] } |
|
|
? { transition: TransitionPresets[props.transition] } |
|
|
: {}), |
|
|
: {}), |
|
|
|