vue上传文件显示进度条，当上传完成后间隔一秒进度条消失

<template>
    <el-upload
      class="avatar-uploader"
      action="api/file/upload"
      :show-file-list="false"
      :before-upload="beforeAvatarUpload"
      :on-progress="handleUploadProgress"
      :on-success="handleAvatarSuccess"
      ref="upload"
    >
      <el-button slot="trigger">Upload File</el-button>
      <div v-if="uploadProgress > 0">
        <el-progress :percentage="uploadProgress"></el-progress>
      </div>
    </el-upload>
  </template>
  
  <script>
  export default {
    data() {
      return {
        uploadProgress: 0,
      };
    },
    methods: {
      beforeAvatarUpload(file) {
        // do some validation on the file
      },
      handleUploadProgress(event, file, fileList) {
        this.uploadProgress = event.percent;
      },
      handleAvatarSuccess(response, file, fileList) {
        this.uploadProgress = 100;
        setTimeout(() => {
          this.uploadProgress = 0;
        }, 1000);
      },
    },
  };
  </script>