vue - element ＜upload＞ 组件批量上传文档，可携带其他表单数据项一同与文件 “手动提交“ 服务器（类似百度文库系统批量上传前端界面与逻辑）超详细教程示例源码，提供界面与逻辑完整源码

效果图

本示例使用的是 element 组件库，其实什么组件库都行（逻辑是一样），只要你是 vue.js 项目就能使用本教程。

本文实现了 vue + element 使用 upload 组件批量上传文档，生成预览 “表单” 修改其他数据，最终将表单数据与文件合并，点击按钮后 “手动” 提交给服务器，

你可以直接复制本文的示例源码，稍微改改就能应用到你的项目中。

---

如下图所示，上传一批文件后自动生成 “预览表单”，然后可以修改或删除某个表单及文件，

还提供了每行数据必填的校验，最终点击按钮后遍历逐一提交给服务器，成功后会改变当前状态（上传成功 / 等待上传）。

示例代码干净整洁，超级详细的注释，保证轻松改造！

示例源码

您要确保本地环境已安装 vue 和 elementui 组件库（否则无法直接运行），或者你用的其他框架，选择性复制代码。

随便找个干净的页面，一键复制运行起来。