Как использовать SweetAlert2 внутри AXIOS.interceptors.response.use ()

Question

Я попытался включить SweetAlert2 в свой проект vue и смог глобально получить доступ к функции swal() в моих представлениях, используя Vue.use() в main.js.

Но когда я попытался использовать его внутри AXIOS.interceptors.response.use(), функция swal() стала undefined.

Вот как выглядит мой файл interceptor.js.

import axios from 'axios'

let instance = axios.create({
   baseURL: '/'
});

export const AXIOS = instance;

AXIOS.interceptors.response.use(

   function(response) {
      // $swal() becomes undefined
      this.$swal('Error', 'Some kind of error', 'error')
      return response;
   }, 

   function(error) {

      // TODO:

      return Promise.reject(error)
   }
)

Есть идеи, как это включить? или, может быть, у вас, ребята, есть лучшее представление о том, как реагировать на глобальные изменения?

Answer 1

Контекст this может больше не соответствовать вашему экземпляру Vue, когда вы использовали его в функции обратного вызова.

Попробуйте изменить файл interceptor.js следующим образом:

import Vue from 'vue';

И вместо использования this.$swal('Error', 'Some kind of error', 'error')

Использование Vue.swal('Error', 'Some kind of error', 'error');