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

相关推荐
mONESY6 分钟前
手把手从零复刻「英文网页 AI 翻译」Chrome 插件(新手向)
javascript
iFlyCai1 小时前
深入理解Flutter:StatefulWidget生命周期全解析(四)
前端·javascript·flutter
xm_xm_xm_12 小时前
Vue 3 项目开发常用操作详细汇总
前端·vue.js
夜雨声烦丿2 小时前
从需求到页面:日期计算器应用的 ArkTS 原生实现
开发语言·javascript·华为·harmonyos
宇智波亚索3 小时前
TypeScript 实际应用
前端·javascript·typescript
雪芽蓝域zzs3 小时前
Vue3+Vite 本地数据模拟 JSON 读取和Mock 方案完整讲解总结
前端·vue.js
:-)3 小时前
idea中的vue文件没有高亮显示
前端·javascript·vue.js·ecmascript·intellij-idea
全栈项目管理程序猿3 小时前
ArcGIS JS 基础教程(14):Map、View 与 Layer 关系
javascript
Southern Wind4 小时前
从一段文字到一部动态漫:如何打造全流程分镜创作工作台 StoryCanvas AI
前端·javascript·vue.js·人工智能
mayaairi4 小时前
JS DOM属性操作完全指南:内容、样式与自定义属性
开发语言·前端·javascript