Vuex Store ist undefined

Question

Ich benutze Vuex, Axios für meine App und ich möchte Getter in Axios Initiation verwenden, um grundlegende Auth zu übergeben. Das ist mein axios init (http-common.js):

import axios from 'axios' 
import store from '@/store' 

export default axios.create({ 
    baseURL: 'http://localhost:8081/', 
    auth: store.getters['authentification'] 
}) 

Wenn ich meine app bin Debuggen ich Speicher undefined finden. Kann mir jemand erklären, was ich falsch mache? Store selbst funktioniert in allen Komponenten einwandfrei.

Mein Geschäft hat mehrere Module und diese Module. store index.js:

import m1 from './modules/m1' 
import m2 from './modules/m2' 
import authentification from './modules/authentification' 

Vue.use(Vuex) 
export default new Vuex.Store({ 
    modules: { 
    authentification, 
    m1, 
    m2 
    } 
}) 

und Module verwendet axios init-Funktion für den Aufruf von REST api das heißt:

import HTTP from '@/common/http-common' 
..... 
const actions = { 
    action ({commit}) { 
     HTTP.get('item') 
      .then(response => { 
       commit('MUTATION', {response}) 
      }) 
    } 
} 
..... 
export default { 
    state, 
    getters, 
    actions, 
    mutations 
} 

Ich denke, diese Schleife erstellt und ruft http-common bevor Speicher wird initialisiert.

Edit: Hinzufügen Authentifikationsmodul wie gewünscht:

import * as types from '../mutation-types' 

const state = { 
    isLoggedIn: !!localStorage.getItem('auth'), 
    auth: JSON.parse(localStorage.getItem('auth')) 
} 
const getters = { 
    isLoggedIn: state => { 
    return state.isLoggedIn 
    }, 
    authentification: state => { 
    return state.auth 
    } 
} 
const mutations = { 
    [types.LOGIN] (state) { 
    state.pending = true 
    }, 
    [types.LOGIN_SUCCESS] (state) { 
    state.isLoggedIn = true 
    state.pending = false 
    }, 
    [types.LOGOUT] (state) { 
    state.isLoggedIn = false 
    } 
} 
const actions = { 
    login ({ 
     state, 
     commit, 
     rootState 
    }, creds) { 
    console.log('login...', creds) 
    commit(types.LOGIN) // show spinner 
    return new Promise(resolve => { 
     setTimeout(() => { 
     localStorage.setItem('auth', JSON.stringify(creds)) 
     commit(types.LOGIN_SUCCESS) 
     resolve() 
     }, 1000) 
    }) 
    }, 
    logout ({ commit }) { 
    localStorage.removeItem('auth') 
    commit(types.LOGOUT) 
    } 
} 

export default { 
    state, 
    getters, 
    actions, 
    mutations 
} 

Answer 1

Ich habe eine sollution gefunden. Ich musste Auth vor dem Anruf zuweisen und nicht während Inizialisierung von Axios-Objekt:

var axiosInstance = axios.create({ 
    baseURL: 'http://localhost:8081/' 
}) 

axiosInstance.interceptors.request.use(
    config => { 
    config.auth = store.getters['authentification'] 
    return config 
    }, error => Promise.reject(error)) 

export default axiosInstance