ThSteps步骤条

此组件为步骤条显示

依赖说明

该组件依赖 element-ui

基本使用

<th-steps :active="active" :step-arr="steps">
  <div slot="icon" class="phone-icon" :style="{'background-position': iconPos}" />
</th-steps>

//js
data () {
  return {
    steps: [
      { title: '验证手机', msg: '安全操作轻松解绑。' },
      { title: '绑定新手机', msg: '安全操作轻松解绑。' },
      { title: '完成', msg: '安全操作轻松解绑。' }
    ],
    active: 0
  }
},

效果演示

Api

参数	说明	类型	默认值	可选值
stepArr	数据源	Array	[]	--
active	当前激活的步骤进度	Number	0	--
icon	图标插槽	slot	--	--

stepArr：

参数	说明	类型	默认值	可选值
title	标题信息，必填	String	--	--
msg	详细描述，非必填	String	--	--