本文主要讲述如何在删除文件时指定自定义参数,如果你对fineuploader组件知之甚少,请先参阅其它资料
前言
最近接手了一个公司项目,项目的前端使用了FineUploader组件进行上传文件,这个组件上传还是很方便的,但是在做删除操作的时候,遇到了很大的麻烦。公司使用阿里云的OSS进行对象存储,删除文件时需要制定文件的名称,该名称在文件上传到OSS之前已经做了自定义的处理,所以无法直接通过FineUploader组件删除(fineuploader组件上传和删除时,默认会传一个qquuid参数,如果你的文件名称使用该qquuid,那就没那么多麻烦了)
上传
前言已经说过,上传图片时会默认带一个qquuid参数,因为我做的项目的文件名称是自定义的,所以我这边不用这个参数。我们看看上传成功后的返回值。
{
"success":true,
"fileName":"other/测试_b8bc7c553b644250a6154d2a4668a731.pdf",
"url":"https://xxx-oss.oss-cn-shenzhen.aliyuncs.com/xxxxxxxxxxxxxxxxxxxxxxx"
}
这里的fileName是我返回的自定义文件名,接下来的删除操作就需要用它来完成。下面是重点,具体思路是:上传完成后将自定义的fileName设置到fineupload的uuid参数中,在删除的时候取这个参数
callbacks:{
//点击删除时触发
onSubmitDelete: function(id) {
//取出对应id的uuid属性,并自定义上传参数名称为fileName
this.setDeleteFileParams({fileName: this.getUuid(id)}, id);
},
//上传完成后触发
onComplete: function(id, fileName, responseJSON) {
//将返回的自定义属性uuid设置到fineupload的uuid属性中
//id指定当前是第几个文件
this.setUuid(id, responseJSON.fileName)
}
}
这里的callbacks是fineupload组件的回调函数,我们看一下删除时的请求参数:
![](https://img.haomeiwen.com/i11088834/937aefea3c2245ea.png)
大功告成!
网友评论