1.0.4 • Published 3 years ago

vuegress-bar v1.0.4

Weekly downloads
-
License
MIT
Repository
github
Last release
3 years ago

vuegress-bar

Lightweight progress-bar component for Vue.

Step 1: Installation

yarn add vuegress-bar

Step 2: Add to project

import  Vue  from  'vue';
import  VuegressBar  from  'vuegress-bar';
import  App  from  './App.vue';

Vue.component("vuegress-bar", VuegressBar);

new  Vue({
    render: h => h(App),
}).$mount('#app');

Step 3: Use component in view

<template>
	<vuegress-bar :sections="sections" :bgColor="bgColor" :fillColor="fillColor" />
</template>

<script>
export default {
data() {
	return {
		sections: {
			titles:  ['summary',  'shipping',  'payment',  'checkout'],
			fillCount: 2
		},
		bgColor: '#E4F5B8',
		fillColor: '#1F01B9'
	};
}
}
</script>

That's all.

Props

Prop nameTypeDescriptionRequired
sectionsObjectObject that contains progress bar settingsyes
sections.titlesArrayString array that represents step titlesyes
sections.fillCountNumberFilled step countyes
bgColorStringBackground color of progress bar as hexadecimalno
fillColorStringColor of filled bars on progress as hexadecimalno
1.0.4

3 years ago

1.0.3

3 years ago

1.0.2

3 years ago

1.0.1

3 years ago

1.0.0

3 years ago