el-steps基础用法不要步骤条的123

el-steps是Element UI提供的一个步骤条组件，可以用来展示流程进度，以下是使用el-steps的基础用法（不包含步骤条的123）。

1. 引入el-steps组件

<template>
  <el-steps :active="activeIndex" finish-status="success">
    <el-step title="步骤一"></el-step>
    <el-step title="步骤二"></el-step>
    <el-step title="步骤三"></el-step>
  </el-steps>
</template>

<script>
import { ElSteps, ElStep } from 'element-ui'

export default {
  components: {
    ElSteps,
    ElStep
  },
  data() {
    return {
      activeIndex: 0
    }
  }
}
</script>

2. 设置active属性控制当前步骤的索引

<el-steps :active="activeIndex" finish-status="success">

3. 设置finish-status属性控制已完成的步骤的状态

<el-steps :active="activeIndex" finish-status="success">

4. 通过点击步骤条切换当前步骤

<el-steps :active="activeIndex" finish-status="success" @step-click="activeIndex = $event">

完整代码如下：

<template>
  <el-steps :active="activeIndex" finish-status="success" @step-click="activeIndex = $event">
    <el-step title="步骤一"></el-step>
    <el-step title="步骤二"></el-step>
    <el-step title="步骤三"></el-step>
  </el-steps>
</template>

<script>
import { ElSteps, ElStep } from 'element-ui'

export default {
  components: {
    ElSteps,
    ElStep
  },
  data() {
    return {
      activeIndex: 0
    }
  }
}
</script>