VUE 开发一套自己的时间轴

最近做VUE开发,要实现时间轴功能,先看效果图

VUE 开发一套自己的时间轴_第1张图片

  1. 这个空间的主要功能点是蓝色竖线的距离和竖线要随着文字的增多而自动变长,实现思路是竖线为右侧的 border-left
  2. 第一个原点为实心,这里循环的时候判断下即可。
  3. 下面附上布局
   
{{item.hourMinuteSecond}} {{item.stateName}} {{item.remark}}
车牌号:{{item.truckPlate}} 司机:{{item.driverName}} 司机手机:{{item.driverTel}}

 

你可能感兴趣的:(Vue)