fix:文件上传组件选择文件未响应问题
This commit is contained in:
parent
9a2fed61d2
commit
a2dd3ee236
@ -4,7 +4,7 @@
|
|||||||
multiple
|
multiple
|
||||||
:action="uploadFileUrl"
|
:action="uploadFileUrl"
|
||||||
:before-upload="handleBeforeUpload"
|
:before-upload="handleBeforeUpload"
|
||||||
:file-list="fileList"
|
v-model:file-list="fileList"
|
||||||
:limit="limit"
|
:limit="limit"
|
||||||
:on-error="handleUploadError"
|
:on-error="handleUploadError"
|
||||||
:on-exceed="handleExceed"
|
:on-exceed="handleExceed"
|
||||||
@ -15,8 +15,7 @@
|
|||||||
:headers="headers"
|
:headers="headers"
|
||||||
:auto-upload="autoUpload"
|
:auto-upload="autoUpload"
|
||||||
class="upload-file-uploader"
|
class="upload-file-uploader"
|
||||||
ref="upload"
|
ref="upload">
|
||||||
>
|
|
||||||
<!-- 拖拽上传 -->
|
<!-- 拖拽上传 -->
|
||||||
<template v-if="drag">
|
<template v-if="drag">
|
||||||
<el-icon class="el-icon--upload">
|
<el-icon class="el-icon--upload">
|
||||||
@ -63,37 +62,37 @@ const props = defineProps({
|
|||||||
// 数量限制
|
// 数量限制
|
||||||
limit: {
|
limit: {
|
||||||
type: Number,
|
type: Number,
|
||||||
default: 5,
|
default: 5
|
||||||
},
|
},
|
||||||
// 大小限制(MB)
|
// 大小限制(MB)
|
||||||
fileSize: {
|
fileSize: {
|
||||||
type: Number,
|
type: Number,
|
||||||
default: 5,
|
default: 5
|
||||||
},
|
},
|
||||||
// 文件类型, 例如['png', 'jpg', 'jpeg']
|
// 文件类型, 例如['png', 'jpg', 'jpeg']
|
||||||
fileType: {
|
fileType: {
|
||||||
type: Array,
|
type: Array,
|
||||||
default: () => ['doc', 'xls', 'ppt', 'txt', 'pdf'],
|
default: () => ['doc', 'xls', 'ppt', 'txt', 'pdf']
|
||||||
},
|
},
|
||||||
// 是否显示提示
|
// 是否显示提示
|
||||||
isShowTip: {
|
isShowTip: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: true,
|
default: true
|
||||||
},
|
},
|
||||||
// 是否拖拽
|
// 是否拖拽
|
||||||
drag: {
|
drag: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false
|
||||||
},
|
},
|
||||||
// 自动上传
|
// 自动上传
|
||||||
autoUpload: {
|
autoUpload: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: true,
|
default: true
|
||||||
},
|
},
|
||||||
// 上传携带的参数
|
// 上传携带的参数
|
||||||
data: {
|
data: {
|
||||||
type: Object,
|
type: Object
|
||||||
},
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
const { proxy } = getCurrentInstance()
|
const { proxy } = getCurrentInstance()
|
||||||
@ -128,7 +127,7 @@ watch(
|
|||||||
return []
|
return []
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{ deep: true, immediate: true },
|
{ deep: true, immediate: true }
|
||||||
)
|
)
|
||||||
|
|
||||||
// 上传前校检格式和大小
|
// 上传前校检格式和大小
|
||||||
@ -170,6 +169,7 @@ function handleExceed() {
|
|||||||
// 上传失败
|
// 上传失败
|
||||||
function handleUploadError(err) {
|
function handleUploadError(err) {
|
||||||
proxy.$modal.msgError('上传失败')
|
proxy.$modal.msgError('上传失败')
|
||||||
|
proxy.$modal.closeLoading()
|
||||||
}
|
}
|
||||||
|
|
||||||
// 上传成功回调
|
// 上传成功回调
|
||||||
@ -222,7 +222,7 @@ function submitUpload() {
|
|||||||
proxy.$refs.upload.submit()
|
proxy.$refs.upload.submit()
|
||||||
}
|
}
|
||||||
defineExpose({
|
defineExpose({
|
||||||
submitUpload,
|
submitUpload
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|||||||
@ -14,7 +14,7 @@
|
|||||||
:on-remove="handleRemove"
|
:on-remove="handleRemove"
|
||||||
:show-file-list="true"
|
:show-file-list="true"
|
||||||
:headers="headers"
|
:headers="headers"
|
||||||
:file-list="fileList"
|
v-model:file-list="fileList"
|
||||||
:on-preview="handlePictureCardPreview"
|
:on-preview="handlePictureCardPreview"
|
||||||
:class="{ hide: fileList.length >= limit }">
|
:class="{ hide: fileList.length >= limit }">
|
||||||
<el-icon class="avatar-uploader-icon"><plus /></el-icon>
|
<el-icon class="avatar-uploader-icon"><plus /></el-icon>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user