elementUI：Upload组件list-type: picture-card上传闪动

直接push file对象 可以解决

多图上传示例

<el-upload action="action" list-type="picture-card" name="image" :file-list="files" :on-remove="handleRemove" :on-success="handleSuccess" :http-request="uploadFile" > <i class="el-icon-plus"></i>
</el-upload>

  

 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
  
8
  
9
  
10
  
11
 

props: { // 引用传递数组 { name, url } files: { type: Array, default: null },
 },
 
methods: { // 自定义实现文件上传 async uploadFile(params) { let form = new FormData(); form.append('image', params.file); const res = await this.$Http.commonUpload(form); return res; }, // 处理添加
	handleSuccess(response, file, fileList) { // 设置url file.url = response.data.url; this.files.push(file);
	}, // 移除
	handleRemove(file, fileList) {
		this.files.splice(0, this.files.length, ...fileList);
	}
} 

  

 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
  
8
  
9
  
10
  
11
  
12
  
13
  
14
  
15
  
16
  
17
  
18
  
19
  
20
  
21
  
22
  
23
  
24
  
25
  
26
  
27
 

参考
饿了么UI组件库中，Upload组件上传闪动的解决

文章来源: pengshiyu.blog.csdn.net，作者：彭世瑜，版权归原作者所有，如需转载，请联系作者。

原文链接：pengshiyu.blog.csdn.net/article/details/112034295