Дублирование событий «добавленного файла» в реализации директивы Vue Dropzone - PullRequest
0 голосов
/ 13 января 2020

Я пишу пользовательскую директиву Vue 1 , чтобы добавить Dropzone к такому элементу:

<b-card block 
    no-body 
        class="m-0" 
        v-for="tag in tags" 
        v-g-dropzone="tag.slug"
        :key="tag.slug" 
        @dz-file-added="dzFileAdded"
        @dz-success="dzSuccess"
        @dz-error="dzError"
    >
...
</b-card>

(я использую Bootstrap Vue для моей инфраструктуры пользовательского интерфейса .)

Когда я сбрасываю файл на мою карту с поддержкой Dropzone, я получаю двойное срабатывание события addedfile Dropzone. В результате файлы добавляются дважды.

Моя директива Vue довольно проста: (Пожалуйста, дайте мне знать, если есть соответствующие подробности, которые я здесь опускаю.)

import Dropzone from "dropzone";

Dropzone.autoDiscover = false;

const bind = function(element, binding, vnode) {

    const settings = { ... }

    const dropzone = new Dropzone(element, settings); 

    dropzone.on("addedfile", function(file) {
        // ...
    });

    // wire other dropzone events

};

const unbind = function(element, binding, vnode) {
    element.dropzone.destroy();
};

export default { bind, unbind };

Что вызывает дубликат addedfile события и как мне его разрешить?

1 Да, я знаю о существующих реализациях Dropzone в Vue. Я не заинтересован в них, поскольку они добавляют слишком много интерфейса.

...