Vant van-progress 标签使用

<van-popup 
  v-model="showProcess" 
  round
  :close-on-popstate="true"
  :close-on-click-overlay="false"
>
  <p>上传中...</p>
  <van-progress
    :percentage="progressValue"
    :show-pivot="false"
    color="#1E90FF"
    track-color="#C0C0C0"
  />
  <span>{
   
   {progressValue}}%</span>
</van-popup>
let vm = this;
vm.showProcess = true
vm.progressValue = 0;
let second = 0;
const timer = setInterval(() => {
  second++;
  if (second <= 100) {
    vm.progressValue = second;
  } else {
    // clearInterval(timer);
  }
}, 80);
.van-popup {
  padding: 24px 20px;
  border-radius: 5px;
  text-align: center;
  p {
    font-size: 15px;
    font-weight: bold;
  }
  .van-progress {
    width: 234px;
    margin: 12px 0;
  }
  span {
    font-size: 14px;
    color: #696969;
  }
}

猜你喜欢

转载自blog.csdn.net/GrootBaby/article/details/109467978