vue-step
vue-step
基于Vue.js的移动端步骤导航组件 Mobile Step Navigation Component Based On Vue.js
Installation
npm i vue-step -S
API
| Param | Description | Type | Default |
|---|---|---|---|
| now-step | The current step, The starting value is 1. | Number |
- |
| step-list | Name of all steps | Array |
- |
| active-color | Active status color | String |
'#1fb11d' |
| style-type | You can set 'style1' or 'style2' | String |
'style1' |
| direction | You can set 'horizontal' or 'vertical' | String |
'horizontal' |
| @selected | Event issued when an item is selected / clicked | Event |
- |
Usage
# example
<template>
<div id="app">
<vue-step :now-step="nowStep" :step-list="stepList"></vue-step>
</div>
</template>
<script>
import vueStep from 'vue-step'
export default {
name: 'app',
data () {
return {
nowStep: 2,
stepList: [
'First Step',
'Second Step',
'Third Step',
'Four Step'
]
}
},
components: {
vueStep
}
}
</script>
Demo Screenshot

License
MIT
Related Packages
yn-components
Advanced and highly reusable Mobile UI Components built on Vue2 & You can define...
3,128
6
Version History
| Version | Released | Vue | License |
|---|---|---|---|
| 1.3.0 | ^2.5.16 | MIT | |
| 1.2.3 | ^2.5.16 | MIT | |
| 1.2.2 | ^2.5.16 | MIT | |
| 1.2.1 | ^2.5.16 | MIT | |
| 1.2.0 | ^2.5.16 | MIT | |
| 1.1.2 | ^2.5.11 | MIT | |
| 1.1.1 | ^2.5.11 | MIT | |
| 1.1.0 | ^2.5.11 | MIT | |
| 1.0.8 | ^2.5.11 | MIT | |
| 1.0.7 | ^2.5.11 | MIT | |
| 1.0.6 | ^2.5.11 | MIT | |
| 1.0.5 | ^2.5.11 | MIT | |
| 1.0.4 | ^2.5.11 | MIT | |
| 1.0.3 | ^2.5.11 | MIT | |
| 1.0.2 | ^2.5.11 | MIT | |
| 1.0.1 | ^2.5.11 | MIT | |
| 1.0.0 | ^2.5.11 | MIT |
