解决element 照片墙上传时回显问题

1.先看看样式：

<el-upload
  class="imgList"
  action="1165165"
  list-type="picture-card"
  :limit="20"
  :file-list="explainImgList"
  :on-remove="handleRemove"
  :on-exceed="handleExceed" //超过上传数量时触发
  :http-request="uploadImgList">
  <i class="el-icon-plus" style="position: relative;bottom: 27px;"></i>
</el-upload>
2.照片回显时参数要对应上才行(这里官方文档没说明，有点坑)，如下

uploadImgList(item) {
  /* 上传账号说明图 */
  let formData = new FormData()
  formData.append(‘file‘, item.file)
  UploadFile(‘/web/account/upload.json‘, formData).then(res => {
    this.explainImgList.push({
      ‘name‘: item.file.name,
      ‘uid‘: item.file.uid,
      ‘url‘: res.fileKey
    })
    Message.success(‘上传成功‘)
  }).catch(err => {
    console.log(err)
    Message.error(‘上传失败‘)
  })
}

handleRemove(file, fileList) {
  /* 移除图片 */
  this.explainImgList = fileList
}
3.样式也可以强制改成我们想要的

<style>
  .imgList .el-upload--picture-card {
    width: 82px;
    height: 82px;
  }

  .imgList .el-upload-list--picture-card .el-upload-list__item {
    width: 82px;
    height: 82px;
  }

  .imgList .el-upload-list--picture-card .el-upload-list__item-thumbnail {
    width: 82px;
    height: 82px;
  }
</style>

解决element 照片墙上传时回显问题

原文：https://www.cnblogs.com/GGDong/p/10996522.html