步骤条(vSteps)

单组件引入

import <name> from ‘vucc/steps’;

示例







代码 V

<v-steps :data="stepsData"></v-steps>
<v-steps :data="stepsData" :size="'small'"></v-steps>
<v-steps :data="stepsData" :is-text-up="true" :size="'small'"></v-steps>
<v-steps :data="stepsData" :append-style="{'margin-left': '30%'}" :is-vertical="true"></v-steps>


data() {
    return {
        stepsData: [{
            order: 1,
            title: '完成',
            explain: '说明文字',
            isFinished: true
        }, {
            order: 2,
            title: '进行中',
            explain: '说明文字',
            isActive: true
        }, {
            order: 3,
            title: '默认尺寸',
            explain: '说明文字'
        }]
    }
}



属性

参数 说明 类型 可选值 默认值
data 组件渲染数据 Array - []
isVertical 组件是否垂直排布 Boolean - false
size 组件的的大小 String normal/small normal
isTextUp 是否将解释文字显示在步进条的上方 Boolean - false
← 加载(vLoading) 标签列表(vTagList) →