Имею приложение vue.
Как получить доступ к магазину из файлов модулей javascript / typescript (импорт / экспорт)?
например, я создаю auth-модуль, который экспортирует состояние, действия, мутации.
export const auth = {
namespaced: true,
state,
actions,
mutations,
getters,
};
В своем приложении я импортирую модуль в свой магазин:
Vue.use(Vuex);
export const store = new Vuex.Store({
modules: {
auth,
}
});
Теперь я хочу создать перехватчик (внутри моего модуля аутентификации) для моих HTTP-вызовов, чтобы добавить токен из магазина.
Vue.http.interceptors.push((request: any) => {
// ---> store.state.token???
// request.headers.set('Authorization', 'Bearer TOKEN');
});
Но как я могу получить доступ к состоянию магазина без зависимости от моего приложения?
import {store} from './store', но можно импортировать экземпляр магазина из модуля vue или vuex.



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


Вы можете сделать это с помощью плагина.
Вот решение, которое я для вас построил:
StoreTokenInterceptorPlugin.ts
import Vue from 'vue';
import VueResource from 'vue-resource';
import { get } from 'lodash';
Vue.use(VueResource);
export const StoreTokenInterceptorPlugin = (store: any) => {
let token: string | null = null;
(Vue.http.interceptors as any).push((request: any) => {
if (token && !request.headers.get('Authorization')) {
request.headers.set('Authorization', `Bearer ${token}`);
}
});
store.subscribe((mutation: any, state: any) => {
token = get(state, 'auth.token') || null;
});
};
в вашем магазине приложений:
import Vue from 'vue';
import Vuex from 'vuex';
import { auth, StoreTokenInterceptorPlugin } from '@modules/auth';
Vue.use(Vuex);
export const store = new Vuex.Store({
state,
modules: {
auth,
} as any,
....
plugins: [StoreTokenInterceptorPlugin],
});