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

相关推荐
单线程121381 小时前
从案例分析 Vue3 Tokenizer 源码
前端·javascript·vue.js
GIS数据转换器2 小时前
智慧林草“一张图“平台
java·大数据·服务器·前端·javascript·数据库·人工智能
烂蜻蜓2 小时前
Flask入门教程(十):静态文件——CSS、JS与图片的正确管理方式
javascript·css·flask
Mr数据杨3 小时前
【Codex】用学生支持周报模块跟踪个性化支持进展
android·java·javascript·django·codex·项目开发
独立开发之道3 小时前
【three.js教程】Three.js 材质详解:从“不反光“到“物理级真实“怎么选
开发语言·javascript·材质
waillyer4 小时前
企业知识库智能问答 Agent(React + Nest)
javascript·redis·agent
Dovis(誓平步青云)6 小时前
模拟器横评:电脑上看小说、追短剧用什么模拟器?MuMu、雷电、腾讯手游助手实测
android·java·服务器·前端·javascript·电脑
丁婷婷6 小时前
Reflect 在 Vue3 响应式中的作用是什么?
vue.js
xiaominlaopodaren6 小时前
three.js最小地图运行时(十):接入离线逻辑瓦片剖面
javascript·gis·three.js
吃西瓜的年年6 小时前
vue3原理思维导图
vue.js·笔记·flutter