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、显示结果:

相关推荐
无懈可击1 小时前
Vue 可视化AI表单设计器 FcDesigner v3.6 版本发布,支持导出 SQL功能!
vue.js·开源·ai编程
徐小夕2 小时前
JitArchives,一款基于JitWord协同AI文档打造的企业级电子档案系统
前端·vue.js·github
vipxieliang2 小时前
JavaScript 迭代器与生成器:控制异步与惰性求值
前端·javascript
Hilaku2 小时前
Event Loop 这篇你看完就不用再看别的了!
前端·javascript·程序员
晓得迷路了3 小时前
栗子前端技术周刊第 153 期 - Vitest 5.1、Remix v3.2、Node.js 27 Alpha...
前端·javascript·vite
系统集成-鹰翔4 小时前
ERP单据已作废为什么商品仍不能删除,引用检查与软删除怎么查
javascript·经验分享·后端
头发还在的女程序员4 小时前
基于 Spring Boot + Vue 3 + uni-app 的灵活用工系统:四端架构与业务流程设计
vue.js·spring boot·uni-app·灵活用工·灵工系统
Penge6664 小时前
《Go 后端开发者学 React:Hook》
javascript
Penge6664 小时前
《Go 后端开发者学 React:前端 HTTP 请求详解》
javascript
Penge66613 小时前
《Go 后端开发者学 React:组件通信与插槽》
javascript