关于el-upload的回显问题

el-upload 是 Element Plus 提供的文件上传组件，支持多种上传方式和丰富的配置选项。通过设置 action 属性指定上传地址，使用 list-type 控制文件列表的显示方式，并通过 on-preview、on-remove、on-success 等回调函数处理文件预览、移除、上传成功和失败等事件。还可以通过 before-upload 钩子限制文件类型和大小，或通过 auto-upload 属性控制是否自动上传。对于更复杂的场景，可以手动触发上传或完全自定义上传逻辑。el-upload

on-success：文件上传成功时的钩子，获取文件上传成功后返回的图片url。action：请求url，从后端那里获取。headers：请求头，可以配置权限。

Element-plus之el-upload上传图片后回显，以及将回显的图片再次上传

el-upload上传文件以及回显照片和下载文件

el-upload 回显处理

单个上传组件el-upload文件回显+el-table组件遍历上传+自定义文件列表+合并表格

这里只是要稍微调整一下代码，和新增有一点点区别，要控制好数据（变量）的更新和销毁，并且考虑更新isHasImageUrl的状态（有一点比较确定的是只有初次进来编辑页，如果有照片才显示el-image，一旦在编辑过程中删除或者替换过照片，之后就是显示的就全部是el-upload了，你可以细品一下，这里不赘述）这个思路其实是比方案二想到的要早，并且我其实知道这个思路是必然能行的，但是我还是最后没有办法了之后再去选择实现它，原因很简单，就是麻烦呗，如果能让el-upload直接回显上传过的图片，或者说。

如果没有图片，就会自动赋值一个空的值给这个数组，就会出现一个空白的照片，每点击一次就添加一次 ```css imgInit() { this.fileUpList.push({ url: this.rowData.refundPic //上传退款截图 }); if (this.rowData.refundPic) { /...

使用上传组件回显时候发现文件并没有加入组件。发现el-upload组件手动添加文件到组件的方法 this.$refs.name.handleStart()

el-upload上传

阅读官网 发现主要通过filt-list来进行回显 要把后端的传回来的数据改为 有url的格式 如下图。图片回显后我们要对个别图片进行删除 主要是 :on-remove="handleRemove"this.detilData.item_image 就是我们传过去的数组。res.data.list.item_image 为接口返回的图片数组。他有两个参数 如果我们只需要把图片的url 都放在一个数组里，传给后端。我们在页面获取接口数据的地方 ，改为 有url的格式来进行回显。elementui官方文档。

在表单中需要上传图片到服务器，并且只有在点击表单的确定按钮时图片以及表单数据才会传到服务器，需要在前端实现下载、上传、预览以及数据回显等需求。

上传图片，并传给后端图片格式是base64。

使用vue+el-upload 实现图片上传，可浏览大图，可删除功能。