VueJs "глобальное" событие не вызывается в моем файле класса

Question

У меня есть фрагмент кода (auth.js), который должен быть запущен после успешного входа пользователя. Но я заметил, что 2 строки не работают. это не тигрирование.

this. $ Axios.defaults.headers.common ['Authorization'] = 'Носитель' + токен; а также . Это $ eventHub $ испускают ( 'userLoggedIn');.

Есть ли что-то, что мне нужно сделать, чтобы оба работали? Я настроил их, чтобы они были доступны по всему миру. я проверил строку: localStorage.setItem ('user', JSON.stringify (user)); и, кажется, работает нормально.

Я пытался удалить это слово, но безрезультатно.

main.js

import auth from '@/auth'

import axios from 'axios'

Vue.prototype.$axios = axios
Vue.prototype.$auth = auth
Vue.prototype.$eventHub = new Vue();

auth.js

class Auth {
    constructor() {
        this.token = null;
        this.user = null;
    }
    login(token, user) {     

        localStorage.setItem('token', token);
        localStorage.setItem('user', JSON.stringify(user));

        this.$axios.defaults.headers.common['Authorization'] = 'Bearer ' + token;

        this.token = token;
        this.user = user;

        this.$eventHub.$emit('userLoggedIn');
    }
    check() {
        return !! this.token;
    }
}
export default new Auth();

это код внутри моего Login.vue, который вызывает метод входа auth.js:

        login() {
            let data = {
                email: this.username,
                password: this.password
            };
            this.$axios.post('http://127.0.0.1:8000/api/login', data)
            .then(({data}) => {
                if (data.status == 200) {
                    this.$auth.login(data.data.token, data.data.user);
                    this.$router.replace('about');
                } else {
                    // console.log("Error");
                }
            })
            .catch(() => {                    
                //alert(response.data.message);
            });
        }

Answer 1

Ключевое слово this в классе Auth не указывает на экземпляр Vue. Вы можете передать экземпляр Vue как параметр метода входа в систему следующим образом:

class Auth {
    constructor() {
        this.token = null;
        this.user = null;
    }
    login(vue, token, user) {     

        localStorage.setItem('token', token);
        localStorage.setItem('user', JSON.stringify(user));

        vue.$axios.defaults.headers.common['Authorization'] = 'Bearer ' + token;

        this.token = token;
        this.user = user;

        vue.$eventHub.$emit('userLoggedIn');
    }
    check() {
        return !! this.token;
    }
}
export default new Auth();

А затем вызвать метод входа в систему следующим образом:

this.$auth.login(this, data.data.token, data.data.user);