博主使用的是vue3 + elementPlus
直接上代码和效果图
<el-dropdown split-button type="primary">
上传文件
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item>
<a style="
display: flex;
align-item: center;
position: relative;
text-align: center;
font-size: 16px;
"
>选择文件夹
<input
type="file"
style="
position: absolute;
left: 0px;
opacity: 0;
z-index: 1;
height: 100%;
width: 100%;
"
ref="inputFolder"
@change="folderChange($event)"
multiple="multiple"
webkitdirectory
/>
</a>
</el-dropdown-item>
<el-dropdown-item>
<a
style="
display: flex;
align-item: center;
position: relative;
text-align: center;
font-size: 16px;
"
>选择文件
<input
type="file"
style="
position: absolute;
left: 0px;
opacity: 0;
z-index: 1;
height: 100%;
width: 100%;
"
ref="inputSingle"
@change="singleFileChange($event)"
multiple
/>
</a>
</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>