Как назначить (использовать) имя входа для загрузчика Uppy, когда у нас есть несколько загрузчиков Uppy - PullRequest
0 голосов
/ 19 марта 2020

Я пытаюсь использовать Uppy для загрузки некоторых изображений в моем приложении Laravel. Мне нужно несколько элементов uppy на одной странице, чтобы каждый загружал одно указанное c изображение. Например, Uppy1 для загрузки образа карты национальности и Uppy2 для загрузки образа Drive License. Я использую приведенный ниже код для загрузки изображений.

<script>
        const Dashboard = Uppy.Dashboard;
        const XHRUpload = Uppy.XHRUpload;

        var cls = '.kt_uppy';
        var options = {
            proudlyDisplayPoweredByUppy: false,
            target: id,
            inline: true,
            resultName: 'uppyResult',
            replaceTargetContent: true,
            showProgressDetails: true,
            note: null,
            height: 170,
            metaFields: [
                { id: 'name', name: 'Name', placeholder: 'file name' },
                { id: 'caption', name: 'Caption', placeholder: 'describe what the image is about' }
            ],
            browserBackButtonClose: true,
        }

        var uppyDashboard = Uppy.Core({
            autoProceed: true,
            restrictions: {
                maxFileSize: 1000000, // 1mb
                maxNumberOfFiles: 1,
                minNumberOfFiles: 1
            }
        });

        uppyDashboard.use(Dashboard, options);
        uppyDashboard.use(XHRUpload, {
            endpoint: '{{ route('upload') }}',
        })

Проблемы:

1 - Можем ли мы использовать и инициировать несколько элементов uppy только с помощью одного кода? (код выше), потому что количество людей, которые мне нужны, чтобы получить информацию, является гибким. Например: в одной семье есть 1 ребенок, а в другой семье - 3 ребенка, а количество загружаемых национальных карт может быть гибким

2 - Как назначить разные атрибуты имени для каждого элемента uppy? как: <input type="file" name"name1"> и <input type="file" name"name2">

...