vue.js中el-steps步骤的简单使用
html中:<div class="step"><el-steps :active="orderStatus" ><el-step :title="item.title" :description="item.description" v-for=&
·
html中:
<div class="step"> <el-steps :active="orderStatus" > <el-step :title="item.title" :description="item.description" v-for="item in items"></el-step> </el-steps> </div>
js中:
1、初始化定义orderStatus、items数组、orderStatus数组
orderStatus: 1,
items:[{title:'开单',description:''},{title:'待付款',description:''},{title:'完成',description:''}]
let orderStatus = { 'NONPAYMENT':2, 'HASDONE':3 };
2、得到的数据对步骤中的description数组进行赋值
this.items[0].description = this.formartDate(res.data.data.createDate); if(res.data.data.updateDate){ this.items[1].description = this.formartDate(res.data.data.updateDate); this.items[2].description = this.formartDate(res.data.data.updateDate); }
3、时间转换方法:
formartDate(param) { let date = new Date(param); Y = date.getFullYear() + '-'; M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-'; D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate(); return Y + M + D; },
更多推荐
已为社区贡献13条内容
所有评论(0)