vue3-countup

基于vue3，countUp.js封装的组件，实现数字滚动效果。
7,913 1
vue vue3 countup 数字滚动 vue3 countup
Install
npm install vue3-countup
Latest Version:0.0.4
Vue:3
License:MIT
Last Updated:Jun 13, 2023
Links: GitHub  ·  npm
Maintainer: cxzhub

Vue3Countup

基于vue3，countUp.js封装的组件，实现数字滚动效果。

示例

<template>
  <Vue3Countup :number="number" />
</template>

<script setup lang="ts">
import { Vue3Countup } from 'vue3-countup'
import { ref } from 'vue'

const number = ref<string | number>(1000)

setInterval(() => {
  number.value = (Math.random() * 5000).toFixed(2)
}, 3000)
</script>

属性

属性名 说明 类型 默认值
number 用于滚动的数字 string,number undefined
decimalPlaces 控制数字位数，不传位数自动计算 number undefined
suffix 后缀 string ''
defaultNumber 默认值 string，number 0
moreOptions 更多属性，见countup.js CountUpOptions {}

事件

事件名 说明 回调参数
finish 滚动结束 val：文本

Related Packages

vue-countup-v2

A CountUp component for Vue

205,565 379
countup vue library vue-countup
vue3-number-roll-plus

vue数字滚动组件

4,284
vue vue3 数字滚动 vue组件 数字
vue-countup-v3

Vue 3 component wrap for countUp.js，and expand some features.

556,518 182
countup vue vue3 vue-count vue-count-to vue-countup vue3-count-to vue3-countup
simplycountdown.js

A lightweight (<5KB) JavaScript countdown library with zero dependencies. Create...

43,140 171
countup vue clock countdown plugin react simplycountdown vanilla
vue3-autocounter

A lightweight Vue 3 component made with TypeScript, you can use it to create an...

140,742
countup vue vue3 autocounter countdown counter counting counto vue-animation vue-component +2

Version History

Version Released Vue License
0.0.4 ^3.2.47 MIT
0.0.3 ^3.2.47 MIT
0.0.2 ^3.2.47 MIT
0.0.1 ^3.2.47 MIT