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

相关推荐
To_OC18 分钟前
LC 1 两数之和:面试第一道必考题,暴力解法直接被面试官 pass
javascript·算法·leetcode
GuWenyue2 小时前
排序效率低?5分钟吃透快速排序,性能飙升至O(nlogn)
前端·javascript·面试
OpenTiny社区2 小时前
🎨 看完 GenUI SDK 源码我悟了!
前端·vue.js·github
何时梦醒2 小时前
深入理解递归与快速排序 —— 从基础入门到手写实现
前端·javascript
bonechips2 小时前
LLM 的无状态:从 HTTP 协议到对话上下文工程
前端·javascript
胡志辉2 小时前
从 prototype 到 V8,看懂 JavaScript 原型链
前端·javascript
mqcode4 小时前
你项目里的 axios,封对了吗?从裸用到生产级的四步进化
vue.js·axios
ping某4 小时前
专栏-null 和 undefined 到底是什么?
前端·javascript·后端
Linsk5 小时前
组件 = 模板 + 业务逻辑
java·前端·vue.js
swipe7 小时前
从 0 到 1 理解 React 虚拟列表:定高、不定高与 Canvas 版本完整拆解
前端·javascript·面试