vuejs 有效负载仅发出数组中的第一个元素

Question

我在 vuejs 中使用 dropzone 插件，dropzone 的响应是一个数组。有效载荷有一个参数数组、一个响应和一个文件对象。每次我调用 @vdropzone-success="$emit('processFunction',$event) 时，它都会正确地将请求发送到正确的函数，但只有负载数组的第一个元素被 returned。为什么？我附上了 vue 调试器的屏幕截图以帮助说明问题。我如何访问 processFunction 中的有效负载以获取数组元素 0 和 1？

添加更多上下文。这是库中向我的子组件发出的函数

    this.dropzone.on("success", function(file, response) {
  vm.$emit("vdropzone-success", file, response);
});

在此之后，在我的 vue 代码中，我将此结果发送到我的索引组件：

      <vue-dropzone
        id="dropzone"
        ref="myVueDropzone"
        @vdropzone-drop="$emit('loading')"
        @vdropzone-success="$emit('loaded',...$event)"
        :use-custom-slot="true"
        :options="dropzoneOptions"
      >

我在这里绑定到我的 index.vue 上的元素：

 <Upload  @loading="loading" @loaded="loaded" />

然后调用加载的函数

loaded(e) {
  console.log(e);
  this.notLoading = true;
  this.isLoading = false;
},

https://github.com/vuejs/vue/issues/5527 这看起来像一个类似的问题。每当我调用 $event 时，它只有 returns 0 是文件。我想要它 return 1 这是服务（对象）的响应。

Answer 1

好的..我觉得应该有更好的方法来做到这一点，但是...看起来我无法通过库中的 vue 标签传递数组变量->child ->parent 直接。相反，我需要在 child 中的 js 中拉出数组，并在 parent 中将其 re-emit 拉出。以下解决方案有效。

图书馆：

  this.dropzone.on("success", function(file, response) {

vm.$emit("vdropzone-success", 文件, 响应); });

child (helper.vue):

          <!-- file upload -->
      <vue-dropzone
        id="dropzone"
        ref="myVueDropzone"
        @vdropzone-drop="$emit('loading')"
        @vdropzone-success="processdata"
        :use-custom-slot="true"
        :options="dropzoneOptions"
      >

以及其中的 js 部分

methods: {
processdata(...ev){
  this.$emit("loaded",ev);
},

最后 parent (index.vue)

<Upload  @loading="loading" @loaded="loaded" />

以及相应的 js

loaded(...e) {
  this.storedValue = e;

这不是最优雅的解决方案，但它确实有效！

Answer 2

你可以试试这个：

Child

@vdropzone-success="$emit('loaded')"

Parent

<Upload  @loading="loading" @loaded="loaded" />

loaded(payload) {
 this.storedValue = payload;
}

vuejs 有效负载仅发出数组中的第一个元素

vuejs payload only emitting first element in an array

vue.js

dropzone