vue实现数字动态增加效果的组件

vue-count-to 实现数字滚动

效果图：

下载组件：

npm install vue-count-to
或
yarn add vue-count-to

引入组件：

import countTo from 'vue-count-to';

注册组件：

export default {
	components:{ countTo }
}

使用组件：
（在需要数字动态增加的位置使用组件）

<!--  startVal开始的数字  endVal结束的数字  duration过渡时间 -->
<countTo :startVal='startVal' :endVal='endVal' :duration='3000'></countTo>

组件配置文档：

Property	Description	type	default
startVal	开始值	Number	0
endVal	结束值	Number	2022
duration	持续时间	Number	3000
autoplay	自动播放	Boolean	true
decimals	要显示的小数位数	Number	0
decimal	十进制分割	String	.
separator	分隔符	String	,
prefix	前缀	String	‘’
suffix	后缀	String	‘’
useEasing	使用缓和功能	Boolean	true
easingFn	缓和回调	Function	—

功能：

Function Name	Description
mountedCallback	挂载以后返回回调
start	开始计数
pause	暂停计数
reset	重置CountTo