Я использовал Dropzone.js в прогрессивной форме отправки данных. Чтобы прояснить сценарий, пользователь сначала вводит личные данные, а затем при нажатии next появляется форма dropzone, в которой пользователь загружает файлы.
Я отключил autoProcessQueue, чтобы дождаться, пока пользователь завершит прикрепление всех необходимых файлов, а затем добавляю дополнительные параметры, а также токен авторизации. На этом этапе, когда пользователь щелкает next, я вызываю метод processQueue(), и это приводит к немедленному переходу к следующей форме, пока прикрепленные файлы загружаются в фоновом режиме. Проблема в том, что мне нужно дождаться загрузки файлов, прежде чем перейти на следующую страницу. Например:
var dropZone = new Dropzone ('[vu-dropzone]', {
...
autoProcessQueue = false,
params: {
purpose: 'Registration',
level: 'A'
},
headers: {Authorization: this.$store.getters['user/getToken']}
});
//submission method
// what I'm actually doing
submit(){
this.dropZone.processQueue();
// go to next route/form
}
//what I'm after async submit(){ await this.dropZone.processQueue(); // go to next route/form }
Есть ли способ добиться этого?



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


Если вы хотите дождаться, пока dropzone загрузит все изображения, прежде чем перейти к следующему экрану, вам, вероятно, следует использовать собственные события success или successmultiple dropzone.
var dropZone = new Dropzone ('[vu-dropzone]', {
// ...
autoProcessQueue = false,
params: {
purpose: 'Registration',
level: 'A'
},
headers: {Authorization: this.$store.getters['user/getToken']},
uploadMultiple: true,
maxFiles: 10,
parallelUploads: 10,
init: function() {
this.on('successmultiple', function(file, response) {
// Here you can go to next form/route
}
}
});
Я рекомендую вам установить maxFiles и parallelUploads на одно и то же значение, максимальное количество файлов, которое вы хотите разрешить, таким образом, когда вы вызываете processQueue(), все файлы будут загружены за один запрос.