vue2中 vue-count-to组件让数字从某个数字动态的显示到某个数字(后附vue3的用法)

1、首先安装

复制代码
 npm install vue-count-to

2、使用

  • 2.1、先导入组件 import countTo from 'vue-count-to'

  • 2.2、注册组件
    components: {
    countTo
    },

  • 2.3、使用组件 <countTo>

结果如下会持续3秒逐渐过渡到100:



vue3中使用

1、先安装:npm install vue3-count-to --save

复制代码
npm install vue3-count-to --save

2、使用

  • 2.1、先导入组件 import { CountTo } from 'vue3-count-to';

  • 2.2、直接使用组件 <count-to :startVal='0' :endVal='100' :duration='3000'>

3、显示结果:

相关推荐
粉末的沉淀3 分钟前
vue:Vite项目中高效管理纯色SVG图标的方案
前端·javascript·vue.js
FlyWIHTSKY3 分钟前
JavaScript 和 TypeScript 分别是什么,可以相互写吗
javascript·ubuntu·typescript
卤蛋fg64 分钟前
vxe-table 列宽与行高拖拽调整:让表格布局极其灵活,拖拽功能非常强大
vue.js
YHHLAI5 分钟前
JavaScript 数据结构精讲:数组底层与实战避坑
开发语言·javascript·数据结构
moMo15 分钟前
Promise 的本质:不是异步处理,而是流程控制
javascript
dotnet9017 分钟前
PDF 页面尺寸上限是 14400。iText 直接加载成功的大图可能超过这个限制,需要在 setPageSize 之前等比缩放。
前端·javascript·html
threelab17 分钟前
Three.js 几何图形变换 | 三维可视化 / AI 提示词
开发语言·前端·javascript·人工智能·3d·着色器
云水一下29 分钟前
TypeScript 从零基础到精通(七):从配置到全栈项目落地
前端·javascript·typescript
向日的葵00636 分钟前
Vue 路由传参的三种方式(三)
vue.js·路由
如果超人不会飞1 小时前
TinyVue Checkbox复选框组件使用指南
前端·vue.js