refactor: 图片/文件上传都支持拖拽

This commit is contained in:
dap 2025-03-30 12:32:58 +08:00
parent 621f79e7d8
commit b9843c6faf
4 changed files with 17 additions and 8 deletions

View File

@ -17,13 +17,7 @@ import { uploadApi } from '#/api';
import { defaultFileAcceptExts, defaultFilePreview } from './helper';
import { useUpload } from './hook';
interface FileUploadProps extends BaseUploadProps {
/**
* 是否支持拖拽上传
* @default false
*/
enableDragUpload?: boolean;
}
interface FileUploadProps extends BaseUploadProps {}
const props = withDefaults(defineProps<FileUploadProps>(), {
api: () => uploadApi,
@ -64,6 +58,10 @@ const {
} = useUpload(props, ossIdList);
</script>
<!--
Upload.Dragger只会影响样式
使用普通Upload也是支持拖拽上传的
-->
<template>
<div>
<CurrentUploadComponent

View File

@ -41,6 +41,7 @@ const props = withDefaults(defineProps<ImageUploadProps>(), {
disabled: false,
listType: 'picture-card',
helpMessage: true,
enableDragUpload: false,
});
// ossId

View File

@ -64,6 +64,11 @@ export interface BaseUploadProps {
* @default false
*/
directory?: boolean;
/**
*
* @default false
*/
enableDragUpload?: boolean;
/**
*
* watch

View File

@ -86,7 +86,12 @@ function customAccept(accept: string) {
:max-count="3"
:enable-drag-upload="true"
/>
当前绑定值: {{ multipleFileId }}
<ImageUpload
class="mt-3"
v-model:value="multipleImageId"
:enable-drag-upload="true"
:max-count="6"
/>
</Card>
<Card title="禁用上传" size="small">