Bootstrap-vue bvModal msgBox - запретить закрытие при нажатии - PullRequest
1 голос
/ 07 июня 2019

Я использую модалы bootstrap-vue для открытия / закрытия элементов моего приложения.

Есть несколько вещей, которые могут пойти не так, например: кто-то другой уже выполнил конфликтующее действие с этим элементом в фоновом режиме. Поэтому я хотел бы предотвратить закрытие модального окна, заменить кнопку вращением при загрузке и отобразить некоторые сообщения проверки в случае сбоя вызова axios.

У меня есть прядильщик, сообщения проверки и т. Д., Работающие в другом месте, поэтому мне не нужна помощь с этим, однако я изо всех сил пытаюсь найти способ доступа к bvModalEvt при использовании msgBox для вызова .preventDefault () on, согласно документации (https://bootstrap -vue.js.org / docs / components / modal / # предотвращение закрытия ).

Я пробовал использовать ключевое слово this в обещании (например, this.preventDefault () и некоторые другие, например, this. $ BvModal.bvModalEvt (я не ожидал, что это сработает, но я отчаялся!)). Все это приводит к срабатыванию блока catch msgBox, и модальный режим все равно закрывается при вызове в заполнителе в моем коде ниже.

Вот голые кости моего метода:

openClose: function() {

    var self = this;

    this.$bvModal.msgBoxConfirm('Are you sure you want to ' + this.closeVerb + ' this item?', {
            title: 'Confirmation',
            size: 'md',
            cancelVariant: 'gray',
            okTitle: 'Confirm',
            cancelTitle: 'Dismiss',
            hideHeaderClose: false,
            centered: true
        })
        .then(function(value){                       

            // Prevent closing here

            if (value === true) {

                axios.post(postUrl, {
                        'action': self.closeVerb,
                    })
                    .then(function(response) {
                        // Handle here.
                    })
                    .catch(error => {
                        // Catch validation errors here.
                    })
            }
        })
        .catch(error => {
        })
}

Любая помощь высоко ценится!

Ответы [ 2 ]

0 голосов
/ 13 июня 2019

Может быть лучше отделить логику проверки от логики msgBox.

когда подтверждающий msgBox возвращает результат, откройте ваш «счетчик» и выполните аксиос, а в случае неудачи откройте новыйmsgBox объясняет ситуацию.

Содержимое окна сообщений не реагирует (поэтому вы не можете динамически обновлять его содержимое)

0 голосов
/ 07 июня 2019

В той же документации, которую вы связали, написано, что вы можете слушать такие события:

export default {
  mounted() {
    this.$root.$on('bv::modal::show', (bvEvent, modalId) => {
      console.log('Modal is about to be shown', bvEvent, modalId)
    })
  }
}

А также есть несколько событий, которые вы можете прослушать.

...