Dropzone.js多个文件上传，获取每个文件的上传进度

更新1

如果在Dropzone配置uploadMultiple被设置为false，那么它工作，因为它在同一时间只上传一个文件。但是我想解决这个问题，同时上传多个文件，然后分别得到每个文件的进度。

我的问题

如果我在下拉区中拖拽一个又一个文件，进度就会正确显示。从0到100%。

如果我拖拽多个文件到下拉区，每个显示的进度是相同的。发送的字节数也是相等的。

但是我需要为每个文件发送一个单独的进度/字节。

我有以下Dropzone配置:

Dropzone.options.scannedFiles = {
    url: '/',
    uploadMultiple: true,
    addRemoveLinks: false,
    previewsContainer: null,
    autoProcessQueue: true,
    previewTemplate: document.getElementById('preview-template').innerHTML,
    init: function () {
        this.on('addedfile', (file) => {
            $(file.previewElement).find("[data-dzc-id]").attr('id', uuid.v4());
        });
        this.on('uploadprogress', (file, progress, bytesSent) => {
            console.log(file);
            console.log(file.upload.progress);
            console.log(file.upload.bytesSent);
            $('#'+ $(file.previewElement).find("[data-dzc-id]").attr('id')).html(file.upload.bytesSent);
        });
    }
};

及之后的预览模板

<div style="display: none" id="preview-template">
    <div class="mdz-wrapper">
        <div class="mdz-content-wrapper">
            <div class="mdz-file-icon">
                <i class="material-icons">insert_drive_file</i>
            </div>
            <div class="mdz-file-info">
                <p data-dz-name></p>
                | <p data-dz-size></p>
            </div>
        </div>
        <div>
            <div>
                <p data-dzc-id></p>
            </div>
            <i class="material-icons" data-dz-remove>cancel</i>
        </div>
    </div>
</div>

console.log()语句的输出，当我将两个文件放入dropzone中时。

一个文件不止一个输出，所以我只发布了一个，因为其他文件只是在增加进度和文件大小。

File 1 Object (size: 269367) | console.log(File);
31.078931778452883 | console.log(file.upload.progress);
1277952 | console.log(file.upload.bytesSent);
[p 45 # a3e751 - 89 - c7 - 41 - fe - 8442 bab98257c688] | console.log ($('#'+ $( file.previewElement);("[data-dzc-id]").attr (id)))

File 2 Object (size: 3842203)
31.078931778452883
1277952
[p # 3 fe0357e - 5 -工程师- 4 - f6a aa9e - 895 ced0469a9]