如何在VueJS之外的其他组件中使用组件？

Question

我有一个在VueJS应用程序中使用的通知组件。以下是发生魔术的文件：

import Notifications from "./Notifications.vue";

const NotificationStore = {
  state: [], // here the notifications will be added

  removeNotification(timestamp) {
    const indexToDelete = this.state.findIndex(n => n.timestamp === timestamp);
    if (indexToDelete !== -1) {
      this.state.splice(indexToDelete, 1);
    }
  },
  addNotification(notification) {
    notification.timestamp = new Date();
    notification.timestamp.setMilliseconds(
      notification.timestamp.getMilliseconds() + this.state.length
    );
    this.state.push(notification);
  },
  notify(notification) {
    if (Array.isArray(notification)) {
      notification.forEach(notificationInstance => {
        this.addNotification(notificationInstance);
      });
    } else {
      this.addNotification(notification);
    }
  }
};

var NotificationsPlugin = {
  install(Vue) {
    Vue.mixin({
      data() {
        return {
          notificationStore: NotificationStore
        };
      },
      methods: {
        notify(notification) {
          this.notificationStore.notify(notification);
        }
      }
    });
    Object.defineProperty(Vue.prototype, "$notify", {
      get() {
        return this.$root.notify;
      }
    });
    Object.defineProperty(Vue.prototype, "$notifications", {
      get() {
        return this.$root.notificationStore;
      }
    });
    Vue.component("Notifications", Notifications);
  }
};

export default NotificationsPlugin;

在$ / src / main.js中，我将插件附加到Vue：

Vue.use(Notifications);

执行ajax任务时，我倾向于使用通知组件，如下所示：

this.$axios.post( 'login', {
                email: self.email,
                password: self.password,
                remember: self.remember
            }).catch(function(error) {  
                if (error.response) {
                    if(error.response.status == 422) { 
                        var text = [];
                        var errors = error.response.data.errors;
                        var key;
                        for (key in errors) { 
                            text.push(errors[key]); 
                        }

                        self.$notify({
                            message: text.join("<br />"),
                            icon: "add_alert",
                            horizontalAlign: "right",
                            verticalAlign: "top",
                            type: "warning",
                            timeout: 10000
                          });
                    }else if(error.response.status == 400){
                        self.$notify({
                            message: error.response.data.message,
                            icon: "add_alert",
                            horizontalAlign: "right",
                            verticalAlign: "top",
                            type: "warning",
                            timeout: 10000
                          });
                    }else if(error.response.status == 404){
                        self.$notify({
                            message: "(404) Your request could not be identified, please verify submitted data.",
                            icon: "add_alert",
                            horizontalAlign: "right",
                            verticalAlign: "top",
                            type: "warning",
                            timeout: 10000
                          });
                    }else if(error.response.status == 500){
                        self.$notify({
                            message: "(500) There was internal error. Please contact our support team.",
                            icon: "add_alert",
                            horizontalAlign: "right",
                            verticalAlign: "top",
                            type: "danger",
                            timeout: 10000
                          });
                    }
                }else{
                    self.$notify({
                        message: "Please verify your internet connection and try again",
                        icon: "add_alert",
                        horizontalAlign: "right",
                        verticalAlign: "top",
                        type: "danger",
                        timeout: 10000
                      });
                }
            }).then(function (response) {
                // handle success
                console.log(response);
            });

问题是我不想为axios复制catch错误部分，因此我使用axios.interceptors.response.use(undefined, function(error) {});将错误处理移至中央区域。但是，现在我正努力将axios错误处理连接到self.$notify。我该怎么做才能使通知正常工作？

axios.interceptors.response.use(undefined, function(error) { 

            self.$notify({
                message: "Hello World",
                icon: "add_alert",
                horizontalAlign: "right",
                verticalAlign: "top",
                type: "warning",
                timeout: 10000
            });
});