el-upload on-success怎么用
时间: 2023-08-25 07:17:46 浏览: 103
el-upload 是 Element UI 提供的上传组件,on-success 是 el-upload 的一个事件,用于在上传成功后执行的操作。使用 on-success 时,需要在 el-upload 标签上绑定该事件,并指定一个方法来处理上传成功的逻辑。
例如,你可以在 el-upload 上添加 on-success 属性,指定一个方法名,如 onUploadSuccess:
```html
<el-upload
action="/upload"
:on-success="onUploadSuccess"
>
<el-button slot="trigger" size="small" type="primary">点击上传</el-button>
</el-upload>
```
然后在 Vue 组件的 methods 中定义 onUploadSuccess 方法来处理上传成功的逻辑:
```javascript
methods: {
onUploadSuccess(response, file, fileList) {
// 在这里处理上传成功后的逻辑
console.log('上传成功');
console.log('响应数据:', response);
console.log('上传的文件:', file);
console.log('文件列表:', fileList);
}
}
```
在这个方法中,你可以根据实际需求进行相应的处理,比如展示上传成功的消息、更新文件列表等。注意,该方法会接收三个参数:response(上传成功后服务器返回的数据)、file(上传的文件对象)和fileList(当前文件列表)。
以上就是使用 el-upload 的 on-success 事件的基本用法。你可以根据具体需求,在 onUploadSuccess 方法中编写自己的逻辑。
阅读全文