fes.js/packages/fes-doc/docs/ui/templates/step/4.md

---
layout: templateLayout
---
```vue
<template>
    <Steps :current="current" direction="vertical">
        <Step title="已完成" content="这里是该步骤的描述信息"></Step>
        <Step title="进行中" content="这里是该步骤的描述信息"></Step>
        <Step title="待进行" content="这里是该步骤的描述信息"></Step>
        <Step title="待进行" content="这里是该步骤的描述信息"></Step>
    </Steps>
    <Wb-button type="primary" @click="next">下一步</Wb-button>
</template>
<script>
export default {
    data() {
        return {
            current: 1
        }
    },
    methods: {
        next() {
            this.current += 1;
            if(this.current > 4){
                this.current = 1;
            }
        }
    }
}
</script>
```