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

相关推荐
Sterting5 小时前
第9课 Vue Router 路由
前端·vue.js
码哥DFS7 小时前
构造函数、实例对象、对象原型 ----三者关系
开发语言·javascript·原型模式
满栀5857 小时前
vue动态路由效果
前端·javascript·vue.js·前端框架·vue
心运软件8 小时前
SpringBoot+ Vue校园社团管理平台的完整架构设计
vue.js·后端
jjw_zyfx8 小时前
css vue vite实现闪烁的呼吸效果
javascript·css·vue.js
sunly_9 小时前
React useActionState 的用法详解
前端·javascript·react.js
cyadyx9 小时前
【Three.js】Three.js 中加载 3D 模型
前端·javascript·3d
汉堡大王952710 小时前
前端工程师 TypeScript 上手指南:一条清晰的从入门到精通路线
前端·javascript·react.js
wear工程师10 小时前
防抖为什么会失效?React 面试里的闭包和定时器
javascript·react.js
浅水壁虎10 小时前
vue基础(第四章 Pinia)
前端·javascript·vue.js