UIKit上传多个实例或事件优先级问题

Question

我使用 UIKit 作为前端框架，并使用 VueJS 制作一些组件。

我使用 VueJS组件上传图像，因此，一个UIkit.upload();

的实例

我在同一页面上两次使用了此组件，因此触发了UIkit.upload();的两个实例。

第一个问题

第一个问题，是否可以两次使用相同的UIkit.upload();实例？或者我只需要使用一个（文档中未提及）。

第二个问题

第二个问题，在页面上使用的第一个组件上检索（已处理）在完全上传图像期间引发的事件，因此第二个组件没有呼叫。

代码

在这里，代码是一张一张地上传图片文件。

<script type="text/ecmascript-6">
    import * as UIkit from "uikit";

    export default {
        data() {
            return {
                url: '',
                bar: null
            }
        },

        mounted() {
            this.bar = document.getElementById('js-progressbar');

            this.init();
        },

        methods: {
            init() {
                let vueInstance = this;
                UIkit.upload('.js-upload', {
                    url: '/dashboard/media/uploads',
                    multiple: false,
                    method: 'POST',
                    name: 'image',
                    mime: 'image/*',
                    beforeSend: vueInstance.beforeSend,
                    beforeAll: vueInstance.beforeAll,
                    load: vueInstance.load,
                    error: vueInstance.error,
                    complete: vueInstance.complete,
                    loadStart: vueInstance.loadStart,
                    progress: vueInstance.progress,
                    loadEnd: vueInstance.loadEnd,
                    completeAll: vueInstance.completeAll
                });
            },
            beforeAll() {},
            beforeSend(e) {
                e.headers = {
                    'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content')
                }
            },
            load() {},
            error() {},
            complete(e) {
                this.$emit('changed', {
                    url: e.response
                });
            },
            loadStart(e) {
                this.$emit('uploading');

                this.bar.removeAttribute('hidden');
                this.bar.max = e.total;
                this.bar.value = e.loaded;
            },
            progress(e) {
                this.bar.max = e.total;
                this.bar.value = e.loaded;
            },
            loadEnd(e) {
                this.bar.max = e.total;
                this.bar.value = e.loaded;
            },
            completeAll() {
                this.bar.setAttribute('hidden', 'hidden');
            }
        }
    }
</script>

<template>
    <div>
        <div class="js-upload uk-placeholder uk-text-center">
            <span uk-icon="icon: cloud-upload"></span>
            <span class="uk-text-middle">Attach image by dropping that here or</span>
            <div uk-form-custom>
                <input name="image" type="file" multiple>
                <span class="uk-link">selecting one</span>
            </div>
        </div>

        <progress id="js-progressbar" class="uk-progress" value="0" max="100" hidden></progress>
    </div>
</template>