解决element upload 移除文件再上传不触发beforeUpload
时间: 2024-01-26 22:03:55 浏览: 84
elementUI里使用青牛云直传
如果需要在移除文件再重新上传同一文件时触发 beforeUpload 事件,可以在 Upload 组件中设置 :auto-upload="false",然后在 beforeUpload 事件中手动调用 upload 方法。具体操作步骤如下:
1. 在 Upload 组件中设置 :auto-upload="false",表示不自动上传文件。
2. 在 beforeUpload 事件中手动调用 upload 方法,上传文件。代码如下:
```
<template>
<el-upload
class="upload-demo"
action="/upload"
:auto-upload="false"
:on-before-upload="handleBeforeUpload"
>
<el-button slot="trigger">选取文件</el-button>
<el-button style="margin-left: 10px;" type="primary" @click="handleUpload">上传文件</el-button>
</el-upload>
</template>
<script>
export default {
methods: {
handleBeforeUpload(file) {
// 在这里手动调用 upload 方法上传文件
this.$refs.upload.upload();
},
handleUpload() {
// 上传文件
this.$refs.upload.submit();
},
},
};
</script>
```
这样就可以在移除文件再重新上传同一文件时触发 beforeUpload 事件了。
阅读全文