fix: 🐛 修复上传文件多选文件时,上传失败的问题

修复上传文件多选文件时,上传失败的问题
This commit is contained in:
Theo
2025-03-19 18:07:23 +08:00
parent 6204deb7cb
commit 98e73fef40
2 changed files with 29 additions and 5 deletions

View File

@@ -46,6 +46,7 @@ import {
UploadRawFile,
UploadUserFile,
UploadFile,
UploadFiles,
UploadProgressEvent,
UploadRequestOptions,
} from "element-plus";
@@ -147,7 +148,7 @@ watch(
function handleBeforeUpload(file: UploadRawFile) {
// 限制文件大小
if (file.size > props.maxFileSize * 1024 * 1024) {
ElMessage.warning("上传图片不能大于" + props.maxFileSize + "M");
ElMessage.warning("上传文件不能大于" + props.maxFileSize + "M");
return false;
}
return true;
@@ -190,10 +191,34 @@ const handleProgress = (event: UploadProgressEvent) => {
/**
* 上传成功
*/
const handleSuccess = (fileInfo: FileInfo) => {
const handleSuccess = (response: any, uploadFile: UploadFile, files: UploadFiles) => {
ElMessage.success("上传成功");
modelValue.value = [...modelValue.value, { name: fileInfo.name, url: fileInfo.url } as FileInfo];
//只有当状态为success或者fail代表文件上传全部完成了失败也算完成
if (
files.every((file: UploadFile) => {
return file.status === "success" || file.status === "fail";
})
) {
let fileInfos = [] as FileInfo[];
files.map((file: UploadFile) => {
if (file.status === "success") {
//只取携带response的才是刚上传的
let res = file.response as FileInfo;
if (res) {
fileInfos.push({ name: res.name, url: res.url } as FileInfo);
}
} else {
//失败上传 从fileList删掉不展示
fileList.value.splice(
fileList.value.findIndex((e) => e.uid === file.uid),
1
);
}
});
if (fileInfos.length > 0) {
modelValue.value = [...modelValue.value, ...fileInfos];
}
}
};
/**

View File

@@ -10,7 +10,6 @@
:http-request="handleUpload"
:on-success="onSuccess"
:on-error="onError"
multiple
>
<template #default>
<el-image v-if="modelValue" :src="modelValue" />