el-upload主动上传
时间: 2023-12-22 08:30:03 浏览: 144
el-upload是Element UI中的一个组件,用于文件上传。主动上传是指用户选择完文件后,需要手动点击上传按钮才能将文件上传到指定的地址。下面是一个el-upload主动上传的示例代码:
```html
<template>
<el-upload
action="/upload"
:auto-upload="false"
:on-success="handleSuccess"
:on-error="handleError"
>
<el-button slot="trigger" size="small" type="primary">选取文件</el-button>
<div slot="tip" class="el-upload__tip">只能上传jpg/png文件,且不超过500kb</div>
</el-upload>
</template>
<script>
export default {
methods: {
handleSuccess(response, file, fileList) {
// 上传成功的处理逻辑
console.log(response);
},
handleError(err, file, fileList) {
// 上传失败的处理逻辑
console.error(err);
}
}
}
</script>
```
在上面的代码中,`auto-upload`属性被设置为`false`,这意味着文件不会自动上传,而是需要手动点击上传按钮触发上传操作。当文件上传成功或失败时,分别会调用`handleSuccess`和`handleError`方法进行处理。
阅读全文