element-ui 步骤条的使用

由于项目中有用到步骤条,在这个过程中,也遇到了坑,可能还是自己能力不足。。。纠结好久


  
  
  

 element-ui中步骤条的基本使用方法如上图所示,更加具体的可以去element-ui的官网查看。由于页面要兼容不同屏幕宽度,所以在项目中设置了space的值为20%,居中样式看着可能更好一点。但是它也存在一个问题,是不支持英文字母自动换行的,所以得自己手动设置word-break: break-all

现在来说一下项目中的要求: 

除了title和description的展示,下面还增加了时间和原因的展示.....

因为这个组件只有title和description两个属性,所以下面时间的展示和原因就有点困难了,还得对应到当前的步骤。我的解决办法就是去找步骤的源码,仿照源码又写了一个组件,其中一部分都是本来组件都有的直接拿来用了






 使用方法如下:


	{{item.auditingTime}}
        

 

你可能感兴趣的:(element-ui 步骤条的使用)