Digit Wheel

A digit wheel animation component for Vue 3.

Installation

npm i vue-digit-wheel -S
or
yarn add vue-digit-wheel -S

Import

Import all the components:

// main.js
import { createApp } from 'vue'
import App from './App.vue'

import VueDigitWheel from 'vue-digit-wheel'

createApp(App)
  .use(VueDigitWheel)
  .mount('#app')

Use in your component:

import { DigitWheelGroup, DigitWheel } from 'vue-digit-wheel'

export default {
  components: { DigitWheelGroup, DigitWheel }
  ...
}

Usage

DigitWheel

<digit-wheel
  size="6xl"
  use-ease="Quit.easeInOut"
  :digit="6"
  :duration="1000"
/>

DigitWheelGroup

<digit-wheel-group
  size="6em"
  format="0,0"
  use-ease="Quit.easeInOut"
  :stagger="true"
  :digits="9527"
  :gutter="16"
  :duration="1000"
/>

License

MIT