el-upload手动上传怎么不显示选择的文件列表
时间: 2024-12-19 11:20:29 浏览: 6
在使用Element UI的el-upload组件进行手动上传时,如果你想要避免显示文件选择的预览面板(即默认的文件列表),你可以通过设置`auto-upload`属性为`false`来禁用自动上传,并自定义按钮点击后的上传操作。例如:
```html
<template>
<div>
<button @click="handleManualUpload">手动上传</button>
<el-upload :action="uploadUrl" :auto-upload="false">
<i class="el-icon-upload"></i>
<span slot="text">点击选择文件</span>
<el-button size="small" type="primary" @click="submitFile">提交</el-button>
</el-upload>
</div>
</template>
<script>
export default {
methods: {
handleManualUpload() {
this.$refs.upload.clearFiles(); // 清空已选文件
this.submitFile();
},
submitFile(file) {
// 这里是你处理手动上传文件的逻辑
// file 是用户选择的单个文件对象
// 可能会进行文件校验、处理等操作,然后调用实际的上传接口
}
}
};
</script>
```
在这个例子中,当你点击“手动上传”按钮时,首先清空选择的文件,然后调用`submitFile`方法来进行具体的文件操作。
阅读全文