0.2.1 • Published 5 years ago
tween-number v0.2.1
tween-number
属性
| 属性 | 描述 | 类型 | 默认值 |
|---|---|---|---|
| value | 结束值 | Number | 0 |
| startVal | 初始值 | Number | 0 |
| duration | 动画间隔（单位毫秒） | Number | 1000 |
| prefix | 前缀 | String | '' |
| suffix | 后缀 | String | '' |
| decimals | 保留小数点后几位数字 | Number | 0 |
| ease | 缓动效果(可选值：'Linear', 'CubicIn','CubicIn','CubicInOut') | String | 'Linear' |
| format | 结果格式化（String格式可填写'money' 'time'） | String, Function | 无 |
| timeLayout | 时间格式化模板（仅对format='time'有效） | String | 'hh:mm:ss' |
使用
安装
npm install tween-number --save-dev引用
<template>
<tween-number v-model="number" :decimals="2"/>
<tween-number suffix="%" v-model="progress" :startVal="progressStart" :duration="300"/>
</template>
<script>
import tweenNumber from 'tween-number';
export default {
components: { tweenNumber },
data () {
return {
number: 123455,
progressStart: 0,
progress: 100
}
}
}
</script>