el-upload实现上传图片/pdf，回显图片/pdf功能。

功能背景：上传图片和查看图片要在一个页面。

如何回显当前行数据已上传的文件？

答：把请求获取的数据赋值给绑定的fileList

<el-upload
    :action="url"
    multiple
    list-type="picture-card"
    :on-preview="handlePictureCardPreview"
    :on-success="successFirstImg"
    :on-remove="removeFirstImg"
    :file-list="firstImgList"
>
   <i class="el-icon-plus"></i>
</el-upload>

this.firstImgList = this.processImageList(res, 1);

文件上传成功后，绑定的filelist变量的length会自动增加一个吗？

答：不会，需要赋值，on-sucess绑定的事件参数filelist 赋值给data中定义的filelist

successFirstImg(res, file, fileList) {
    this.$message.success(res.msg);
    this.firstImgList = fileList;
},

如何把回显的文件和操作上传的文件一起提交给后台

答案：回显的文件中没有response对象，上传成功的文件会包含response对象，把两种数据提取出来组合在一起就可以了

如何显示和回显pdf文件，

在 HTML 中，<img> 标签主要用于显示图像文件，如 JPEG、PNG、GIF 等。PDF 文件并不是图像文件，因此 <img> 标签无法直接显示 PDF 内容。

el-upload内置的是img标签所有不支持pdf,

1.第一种方案用的iframe标签

缺点: iframe加载很慢，最少得等40秒才能出来，

2.第二种方案用的标签加载很快，

使用 <embed> 或 <object> 标签：

- 这些标签可以嵌入 PDF 文件，并且大多数现代浏览器都支持这些标签来显示 PDF。

<embed src="path/to/your/file.pdf" type="application/pdf" width="600" height="500">
<object data="path/to/your/file.pdf" type="application/pdf" width="600" height="500">
  <p>您的浏览器不支持 PDF 显示。</p>
</object>

总结：用或