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

Question

我正在使用 vue2-dropzone which exposes a list of events对于文件传输完成的时间。

在我的 SFC（单文件组件）中，我使用了其中的 2 个 dropzone 组件来区分不同的上传。我使用事件

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

在 dropzone 之外分别显示每个 dropzone 的进度。

<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 种方法，progress、progress1 和 progress2，其中 progress1 和 2 都会使用附加的 'from_dz1' 字符串调用 progress，但这似乎不是一个可扩展的想法。如果我使用超过 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>

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

Adding custom parameter in vue2-dropzone event

dropzone.js

vue.js

vue-component

vuejs2