变更element步骤条样式添加①②③.....

原本样式:

变更后样式:

页面代码:

<el-steps :active="active" finish-status="success" simple style="margin-top: 20px"><el-step><template #icon><span class="font">①</span></template><template #title><span>主要信息 (<b class="bred">必填</b>)</span></template></el-step><el-step><template #icon><span class="font">②</span></template><template #title><span>次要信息(<b class="bblue">非必填</b>)</span></template></el-step><el-step><template #icon><span class="font">③</span></template><template #title><span>哈哈信息(<b class="bblue">非必填</b>)</span></template></el-step></el-steps><div v-show="active===0">主要信息</div> <div v-show="active===1">次要信息</div> <div v-show="active===2">哈哈信息</div> 
<el-button type="primary" @click="next">下一步</el-button>

定义变量:

data() {return {active: 0,}
}

定义方法:(我这个只能走两步,想走多步自己按需设置)

 next() {console.log(this.active);if (this.active++ >= 2) {this.active = 2;}},

css代码:

.font {font-size: 15px;
}