el-step给步骤增加单击事件

原文:https://www.cnblogs.com/jin-zhe/p/10181895.html

简单来说,只添加click 和css :hover就好了

一、组件里

<el-steps :space="200" :active="1" finish-status="success">
  <el-step @click.native="on_click(1)" title="已完成"></el-step>
  <el-step @click.native="on_click(2)" title="进行中"></el-step>
  <el-step @click.native="on_click(3)" title="步骤 3"></el-step>
</el-steps>

二、方法里

methods: {
      on_click(e){
       console.log(e);
    }
  }

三、css里

.el-step__head:hover {
  color: #67c23a;
  border-color: #67c23a;
}