【element-ui】element如何在循环中让点击的当前对象获取到当前上传文件的文件名？

图片描述

这个表格是循环一个数组里的对象生成的，有7个对象和7个上传组件，上传文件后，图中的文本<上传文件>换成已上传文件的文件名，但是<el-upload>并没有提供相应的events把当前点击的对象和当前的上传文件联系起来，如何处理这种情况？自己想了两个办法都行不通

如果通过点击事件来存储点击的对象，因为上传文件是异步的，文件小的几kb上传快，有的文件大的几mb上传慢，如果第一个上传的文件在第二个上传的文件之后完成，那么这样就出错了

问题已经解决了，非常感谢大家的回答

回答：

上传文件的标签要独立，在上传的时候让后台添加一个上传参数为上传文件类型(具体的使用数字还是文字你们决定，只要能区分是什么类型的就可以)，上传成功之后要求后台把这个上传时候发过去的文件类型返回，前端做区分。

回答：

before-upload时不是可以获取file吗？

beforeAvatarUpload(file) {
console.log(file.name);
}

这个file.name就是文件名，上传成功后赋值就行了

回答：

<el-upload @on-success="handleFileUploaded"></el-upload>
handleFileUploaded(response, file, fileList) {
    //response是后台返回给你的数据
    //通过后台的返回是功能测试报告还是性能测试报告
    //你再把file.name放到相应的对象里去
}

回答：

我觉得可以以节流函数作为参考,,,只要最终返回的是一个无参函数即可

回答：

可以用闭包实现：

<el-upload
  :on-change="(file, fileList) => onChange(file, fileList, index)"
>
  <template #default><i class="el-icon-plus"></i></template>
</el-upload>
onChecksChange(file, fileList, index) {
  console.log(file, fileList, index)
},

关键是上面的 index。使用了闭包的特性。

以上是 【element-ui】element如何在循环中让点击的当前对象获取到当前上传文件的文件名？ 的全部内容， 来源链接： utcz.com/a/152963.html

回到顶部