vue 数字累加动画插件
| 参数 | 取值 | 说明 |
|---|---|---|
| start | Boolean | 是否开始动画 |
| number | Number | 动画最终到达数字 |
| animationType | String | 详情参考动画类型 |
| frames | Number | 执行动画针数，默认60，即执行60次完成动画 |
| 名称 | 参数 | 说明 |
|---|---|---|
| @done | 无 | 动画执行完成 |
安装支持动画为如下几种类型，了解详情可查阅贝塞尔曲线相关知识 "linear", "easeInSine", "easeOutSine", "easeInOutSine", "easeInQuad", "easeOutQuad", "easeInOutQuad", "easeInCubic", "easeOutCubic", "easeInOutCubic", "easeInQuart", "easeOutQuart", "easeInOutQuart", "easeInQuint", "easeOutQuint", "easeInOutQuint", "easeInBack", "easeOutBack", "easeInOutBack", "easeInElastic", "easeOutElastic", "easeInOutElastic", "easeInBounce", "easeOutBounce", "easeInOutBounce",
npm install @oldeng/v-number-counter
使用
//导入 import { NumberCounter } from "@oldeng/v-number-counter"; import "@oldeng/v-number-counter/dist/v-number-counter.css";
//使用
<v-number-counter
:number="number"
:frames="200"
:animationType="currentAnimation"
:start="true"
@done="doneHandler"
></v-number-counter>
Github
Npm
源码分析
版权声明：
1、该文章(资料)来源于互联网公开信息，我方只是对该内容做点评，所分享的下载地址为原作者公开地址。2、网站不提供资料下载，如需下载请到原作者页面进行下载。
