el-upload on-success
时间: 2023-11-17 08:03:56 浏览: 41
el-upload组件是一个文件上传组件,on-success是el-upload组件的一个属性,用于指定上传成功后的回调函数。具体来说,当文件上传成功后,on-success属性所指定的回调函数会被调用,从而可以执行一些上传成功后的操作,比如更新上传进度、显示上传成功的提示信息等。
下面是一个el-upload组件的示例代码,其中on-success属性指定了一个名为handleUploadSuccess的回调函数:
```html
<el-upload
class="upload-demo"
drag
ref="fileUpload"
:action="urls.fileUpload"
:on-success="handleUploadSuccess"
:on-error="handleUploadError"
:on-progress="progressUpload"
:before-upload="beforeUpload">
<i class="el-icon-upload"></i>
<div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div>
<div class="el-upload__tip" slot="tip">只能上传jpg/png文件,且不超过500kb</div>
</el-upload>
```
```javascript
methods: {
handleUploadSuccess(response, file, fileList) {
console.log(response);
console.log(file);
console.log(fileList);
},
handleUploadError(err, file, fileList) {
console.log(err);
console.log(file);
console.log(fileList);
},
progressUpload(event, file, fileList) {
console.log(event);
console.log(file);
console.log(fileList);
},
beforeUpload(file) {
console.log(file);
}
}
```
在上面的代码中,handleUploadSuccess是一个回调函数,它会在文件上传成功后被调用。该函数接收三个参数:response、file和fileList,分别表示上传成功后服务器返回的数据、上传的文件对象和已上传的文件列表。在该函数中,我们可以根据需要对上传成功后的数据进行处理,比如更新页面显示、保存数据等。