vue-progress-bar

Progress Bar (Vue Component)

Progress Bar component for Vue JS v2.

Install

Download dependency using npm:

npm install vue-progress-bar

Then, to use the component in regular HTML:

<script src="[path-to-package]/dist/vue.progress-bar.min.js"></script>

Or with NodeJS:

// As global component
Vue.component('progress-bar', require('./parts/vue.progress-bar'));

// As regular element component
var appSample = new Vue({
    el:'#my-app',
    components: {
        'progress-bar': require('./parts/vue.progress-bar'),
    } 
});

Usage

Simple add the markup in your template as follows. Use v-model to bind the progress value to the component.

<progress-bar v-model="progressValue"></progress-bar>

Note: Progress value can be either decimal or float percentage value; it is recommended to use float percentage like 0.5 to indicate 50%.

Properties

License

MIT License 2017 (c) 10 Quality.