条形进度条

效果图：

<div class="check-progress">
	<div class="check-progress-inner" :style="'width:' + progressWidth + '%'"></div>
</div>

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

mounted(){
	this.progressWidth = 0
	let self = this
      setInterval(() => {
        if (self.progressWidth < 90){
          self.progressWidth = self.progressWidth + 5
        }
      },500)
}

css

.check-progress{
  width: 150px;
  height: 15px;
  background: rgba(0, 113, 183, 0.2);
}
.check-progress-inner{
  /*width: 60%;*/
  height: 100%;
  background-image: linear-gradient(-45deg,#0071B7 0,#0071B7 25%,#2683C2 0,#2683C2 50%,#0071B7 0,#0071B7 75%,#2683C2 0,#2683C2 100%);
  background-size: 15px 15px;
  -webkit-animation: back-animation 10s infinite linear;
}
@-webkit-keyframes back-animation {
  from{
    background-position-x: 0;
  }
  to{
    background-position-x: 400px;
  }
}