1.请求资源进度条
效果如下
<template>
<el-progress type="circle" :percentage="percentage" />
</template>
<script setup>
import axios from "axios";
import { ref } from "vue";
let percentage = ref(0);
axios({
method: "get",
responseType: "blob", // 流文件为blob类型
url: "文件地址",
onDownloadProgress(ProgressEvent) {
percentage.value = Math.round(ProgressEvent.progress * 100);
console.log("进度", percentage.value);
},
}).then(({ data }) => {
console.log("接口请求完成", data);
});
</script>
2.文件上传进度条
=====有灵感再写=====