fix:图片、文件上传失败时,后续无法上传的问题 https://github.com/yudaocode/yudao-ui-admin-vue3/issues/86
parent
f659899f8e
commit
2773b0ec24
|
|
@ -122,7 +122,9 @@ const beforeUpload: UploadProps['beforeUpload'] = (file: UploadRawFile) => {
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
message.success('正在上传文件,请稍候...')
|
message.success('正在上传文件,请稍候...')
|
||||||
|
// 只有在验证通过后才增加计数器
|
||||||
uploadNumber.value++
|
uploadNumber.value++
|
||||||
|
return true
|
||||||
}
|
}
|
||||||
// 处理上传的文件发生变化
|
// 处理上传的文件发生变化
|
||||||
// const handleFileChange = (uploadFile: UploadFile): void => {
|
// const handleFileChange = (uploadFile: UploadFile): void => {
|
||||||
|
|
@ -149,6 +151,8 @@ const handleExceed: UploadProps['onExceed'] = (): void => {
|
||||||
// 上传错误提示
|
// 上传错误提示
|
||||||
const excelUploadError: UploadProps['onError'] = (): void => {
|
const excelUploadError: UploadProps['onError'] = (): void => {
|
||||||
message.error('导入数据失败,请您重新上传!')
|
message.error('导入数据失败,请您重新上传!')
|
||||||
|
// 上传失败时减少计数器,避免后续上传被阻塞
|
||||||
|
uploadNumber.value = Math.max(0, uploadNumber.value - 1)
|
||||||
}
|
}
|
||||||
// 删除上传文件
|
// 删除上传文件
|
||||||
const handleRemove = (file: UploadFile) => {
|
const handleRemove = (file: UploadFile) => {
|
||||||
|
|
|
||||||
|
|
@ -97,20 +97,28 @@ const uploadList = ref<UploadUserFile[]>([])
|
||||||
const beforeUpload: UploadProps['beforeUpload'] = (rawFile) => {
|
const beforeUpload: UploadProps['beforeUpload'] = (rawFile) => {
|
||||||
const imgSize = rawFile.size / 1024 / 1024 < props.fileSize
|
const imgSize = rawFile.size / 1024 / 1024 < props.fileSize
|
||||||
const imgType = props.fileType
|
const imgType = props.fileType
|
||||||
if (!imgType.includes(rawFile.type as FileTypes))
|
const isValidType = imgType.includes(rawFile.type as FileTypes)
|
||||||
|
const isValidSize = imgSize
|
||||||
|
|
||||||
|
if (!isValidType)
|
||||||
ElNotification({
|
ElNotification({
|
||||||
title: '温馨提示',
|
title: '温馨提示',
|
||||||
message: '上传图片不符合所需的格式!',
|
message: '上传图片不符合所需的格式!',
|
||||||
type: 'warning'
|
type: 'warning'
|
||||||
})
|
})
|
||||||
if (!imgSize)
|
if (!isValidSize)
|
||||||
ElNotification({
|
ElNotification({
|
||||||
title: '温馨提示',
|
title: '温馨提示',
|
||||||
message: `上传图片大小不能超过 ${props.fileSize}M!`,
|
message: `上传图片大小不能超过 ${props.fileSize}M!`,
|
||||||
type: 'warning'
|
type: 'warning'
|
||||||
})
|
})
|
||||||
uploadNumber.value++
|
|
||||||
return imgType.includes(rawFile.type as FileTypes) && imgSize
|
// 只有在验证通过后才增加计数器
|
||||||
|
if (isValidType && isValidSize) {
|
||||||
|
uploadNumber.value++
|
||||||
|
}
|
||||||
|
|
||||||
|
return isValidType && isValidSize
|
||||||
}
|
}
|
||||||
|
|
||||||
// 图片上传成功
|
// 图片上传成功
|
||||||
|
|
@ -172,6 +180,8 @@ const uploadError = () => {
|
||||||
message: '图片上传失败,请您重新上传!',
|
message: '图片上传失败,请您重新上传!',
|
||||||
type: 'error'
|
type: 'error'
|
||||||
})
|
})
|
||||||
|
// 上传失败时减少计数器,避免后续上传被阻塞
|
||||||
|
uploadNumber.value = Math.max(0, uploadNumber.value - 1)
|
||||||
}
|
}
|
||||||
|
|
||||||
// 文件数超出提示
|
// 文件数超出提示
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue