mirror of
https://gitee.com/huangge1199_admin/vue-pro.git
synced 2024-11-22 23:31:52 +08:00
v3.8.2 组件ImageUpload支持多图同时选择上传
This commit is contained in:
parent
20bf581acf
commit
582fead405
@ -1,6 +1,7 @@
|
||||
<template>
|
||||
<div class="component-upload-image">
|
||||
<el-upload
|
||||
multiple
|
||||
:action="uploadImgUrl"
|
||||
list-type="picture-card"
|
||||
:on-success="handleUploadSuccess"
|
||||
@ -70,6 +71,8 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
number: 0,
|
||||
uploadList: [],
|
||||
dialogImageUrl: "",
|
||||
dialogVisible: false,
|
||||
hideUpload: false,
|
||||
@ -124,9 +127,14 @@ export default {
|
||||
},
|
||||
// 上传成功回调
|
||||
handleUploadSuccess(res) {
|
||||
this.fileList.push({ name: res.fileName, url: res.fileName });
|
||||
this.$emit("input", this.listToString(this.fileList));
|
||||
this.loading.close();
|
||||
this.uploadList.push({ name: res.fileName, url: res.fileName });
|
||||
if (this.uploadList.length === this.number) {
|
||||
this.fileList = this.fileList.concat(this.uploadList);
|
||||
this.uploadList = [];
|
||||
this.number = 0;
|
||||
this.$emit("input", this.listToString(this.fileList));
|
||||
this.loading.close();
|
||||
}
|
||||
},
|
||||
// 上传前loading加载
|
||||
handleBeforeUpload(file) {
|
||||
@ -163,6 +171,7 @@ export default {
|
||||
text: "上传中",
|
||||
background: "rgba(0, 0, 0, 0.7)",
|
||||
});
|
||||
this.number++;
|
||||
},
|
||||
// 文件个数超出
|
||||
handleExceed() {
|
||||
|
Loading…
Reference in New Issue
Block a user