@litt1e-p/progress-bar v0.1.5

Introduce

a progress component with count up animation effect for vue

vue 2.x supports

Installation

npm i @litt1e-p/progress-bar@next

Usage

1. global component register

// in main.js
import ProgressBar from '@litt1e-p/progress-bar'
import '@litt1e-p/progress-bar/dist/progressBar.css'
// or 
@import '@litt1e-p/progress-bar/dist/progressBar.css'

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

<progress-bar :percent="your value"></progress-bar>

2. normal component in any vue component

// in any vue component file
import { ProgressBar } from '@litt1e-p/progress-bar'
import '@litt1e-p/progress-bar/dist/progressBar.css'
// or 
@import '@litt1e-p/progress-bar/dist/progressBar.css'

<progress-bar :percent="your value"></progress-bar>

3. custom tintColor & bgColor

<progress-bar :percent="your value" tintColor="#f0ff0f" bgColor="gray"></progress-bar>

Screenshots