Event.preventdefault () после асин c функции - PullRequest
0 голосов
/ 17 апреля 2020

Чтобы предотвратить переход bs-stepper к следующему шагу, я использую этот подход обработчика событий. К сожалению, этот подход, похоже, не работает с асинхронной c функцией, такой как isFaceValid () ... Обе версии ниже не работают. Неважно, использую я ключевое слово asyn c или нет.

Возможно ли даже то, чего я пытаюсь достичь?

В настоящий момент я предполагаю, что должен придерживаться этого подхода к обработчику событий, я не вижу другого способа работы с bs-stepper https://github.com/Johann-S/bs-stepper

stepperFormEl.addEventListener('show.bs-stepper', function(event) {
    form.classList.remove('was-validated')
    var nextStep = event.detail.indexStep
    var currentStep = nextStep

    if (currentStep > 0) {
        currentStep--
    }

    var stepperPan = stepperPanList[currentStep]

    if ((stepperPan.getAttribute('id') === 'test-form-1' && (!$('#inputUserImage').get(0).files.length)) ||
        (stepperPan.getAttribute('id') === 'test-form-1' && !anAsyncFunction())) {
        event.preventDefault();
        form.classList.add('was-validated')
    }
})


stepperFormEl.addEventListener('show.bs-stepper', async function(event) {
    form.classList.remove('was-validated')
    var nextStep = event.detail.indexStep
    var currentStep = nextStep

    if (currentStep > 0) {
        currentStep--
    }

    var stepperPan = stepperPanList[currentStep]

    if ((stepperPan.getAttribute('id') === 'test-form-1' && (!$('#inputUserImage').get(0).files.length)) ||
        (stepperPan.getAttribute('id') === 'test-form-1' && !await anAsyncFunction())) {
        event.preventDefault();
        form.classList.add('was-validated')
    }
})

Ответы [ 2 ]

0 голосов
/ 19 апреля 2020

Вы можете избежать использования подхода с обработчиком событий, bs-stepper поставляется с различными доступными методами c publi, такими как «next» или «previous». См .: https://github.com/Johann-S/bs-stepper#next

Таким образом, вы можете сделать что-то вроде

if (!await anAsyncFunction()) {
  return;
}

bsStepper.next();

, например, вы сможете запретить показ следующего шага

0 голосов
/ 18 апреля 2020

Адаптируя рабочий процесс пользователя, я смог сохранить синхронность кода обработчика событий. Проблема решена:)

...