el-steps simple显示当前步骤数

elementui的步骤条组件（el-steps）
普通样式长这样，title（步骤1，步骤2）位于下面

截屏2020-05-07上午11.22.46.png

想要的是在一条线上，这时看文档发现该组件有一个simple属性（是否应用简洁风格）
拿来一试果然在一条线上了，长这样

image.png

但是圈里的数字1，2没有了，这时需要这样做<template slot="icon" >{{index+1}}</template>代码如下：

<el-steps :active="curSteps"  finish-status="success" simple v-if="showStep && steps.length > 1">
  <el-step v-for="(item,index) in steps" :title="item" :key="`step${index}`">
    <template slot="icon" >{{index+1}}</template>
  </el-step>
</el-steps>

然后就搞定了，结果是这样的

image.png

如果想要把图标换成图片，就像这样

截屏2020-05-07上午11.30.50.png

那么看代码：

<el-steps :active="1">
  <el-step title="步骤 1">
    <template slot="icon" >
      <img src="http://img4.imgtn.bdimg.com/it/u=2480604110,4008147240&fm=26&gp=0.jpg" style="height:25x;width:25px;">
    </template>
  </el-step>
  <el-step title="步骤 2" icon="el-icon-upload">
    <template slot="icon" >
      <img src="http://img.zcool.cn/community/01bc1c5694b3e932f87574bef9bc29.png" style="height:25x;width:25px;">
    </template>
  </el-step>
  </el-step>
  <el-step title="步骤 3" icon="el-icon-picture"></el-step>
</el-steps>