# 上传文件和文件夹
# 1、上传文件
设置属性 type="file"
可以选择文件,设置属性 multiple
可以多选
<input ref="fileInputRef" type="file" @change="onUpload" multiple class="upload-input" />
1
const onUpload = async (evt: any) => {
console.log(evt.target.files);
// 上传多文件
const data = new FormData()
data.append("files", evt.target.files[0])
data.append("files", evt.target.files[1])
};
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
# 2、上传文件夹
设置属性 webkitdirectory
可以选择文件夹
<input
type="file"
@change="selectFolder"
webkitdirectory
class="upload-input" />
1
2
3
4
5
2
3
4
5
const selectFolder = async (evt: any) => {
const files = evt.target.files;
if (files.length > 0) {
const fileDic = files[0].webkitRelativePath; // 文件夹名
} else {
window.$message.info('选择了一个空文件夹');
}
};
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
← vue导入图片 使用animate动画 →