在 vue2-dropzone 事件中添加自定义参数

Question

我正在使用vue2-dropzone，它公开了事件列表，例如文件传输完成时。

在我的 SFC(单个文件组件)中，我使用其中 2 个拖放区组件来区分不同的上传。我使用事件

vdropzone-upload-progress(file, progress, bytesSent)

以分别显示放置区外每个放置区的进度。

<vue-dropzone @vdropzone-upload-progress="progress($event, 'from_dz1')" ref="myVueDropzone" id="dz1" :options="dropzoneOptions"></vue-dropzone>
<vue-dropzone @vdropzone-upload-progress="progress($event, 'from_dz2')" ref="myVueDropzone" id="dz2" :options="dropzoneOptions"></vue-dropzone>

当我这样做时，在我的progress方法中，我只能获取file对象和我的自定义参数from_dz1并from_dz2因为它与原始位置的第一个位置匹配。

无论如何，我可以做@vdropzone-upload-progress="progress(file, progress, bytesSent, 'from_dz1')"，在我的progress方法中，我确实

progress: function (file, progress, bytesSent, origin) {
console.log(file.name, 'from', origin, progress, '% done')
}

并能够获得所有 4 个参数？

我想到的一种解决方法是有 3 种方法，进度、进度 1 和进度 2，其中 progress1 和 2 都会使用额外的"from_dz1"字符串调用进度，但这似乎不是一个可扩展的想法。如果我使用了超过 1 个事件，我最终会得到更多的方法，同样，如果我有更多的放置区，我最终会得到更多的方法。

Answer 1

你应该能够做到

<vue-dropzone @vdropzone-upload-progress="(file, progress, bytesSent) => progress(file, progress, bytesSent, 'from_dz1')" ref="myVueDropzone" id="dz1" :options="dropzoneOptions"></vue-dropzone>