Блог

Я довольно новичок в Vue и Snotify, поэтому, пожалуйста, простите за вопрос newb. Я просмотрел документы, и у меня ничего не выскакивает.

Вот в чем дело: у меня есть компонент Vue, который удаляет файлы, используя окно подтверждения Snotify. Вот так:

 destroy() {
    this.$snotify.confirm('', 'Delete File?', {
      buttons: [
            {
                text: 'Yes',
                action: (toast) => {
                    axios.delete([API endpoint])
                    .then(response => {
                        // destroy the vue listeners, etc
                        this.$destroy();

                        // remove the element from the DOM
                        this.$el.parentNode.removeChild(this.$el);
                    });
                    this.$snotify.remove(toast.id);
                }
            },
            {
                text: 'No',
                action: (toast) => {
                    this.$snotify.remove(toast.id)
                }
            }
        ]
    })
}
 

Проблема в том, что если вы нажмете кнопку «Удалить» во второй раз, появится еще один «Удалить файл»? подтверждение появляется над первым. Ожидаемое поведение заключается в том, что второй щелчок приведет к удалению подтверждения.

Мы будем признательны за любую помощь, которую вы можете предложить.

this.$snotify.confirm() возвращает всплывающую информацию, которая включает идентификатор, который может быть передан this.$snotify.remove() для удаления:

 export default {
  methods: {
    destroy() {
      if (this._toast) {
        this.$snotify.remove(this._toast.id, true /* immediate */)
      }

      this._toast = this.$snotify.confirm('', 'Delete File?', {/*...*/})
    }
  }
}
 

ДЕМОНСТРАЦИЯ