Vuex 정의되지 않은 속성을 읽을 수 없습니다

Question

Vuex로 전역 변수로 작업하려고하지만 undefinedVuex을 Vue.use();으로 초기화해도 오류가 계속 발생합니다.

TypeError: Cannot read property 'isAuth' of undefined

store.js :

import Vue from 'vue'; 
import Vuex from 'vuex'; 

Vue.use(Vuex); 

export default new Vuex.Store({ 
    isAuth: true, 
}); 

main.js :

import store from './store/store'; 
.... 
new Vue({ 
    el: '#app', 
    store, 
    router, 
    render: h => h(App), 
....... 

내가 이런 식으로 값을 볼 수 isAuth 전화는 : this.$store.isAuth;은이는 undefined 오류가 발생합니다.

Vuex을 store.js에 초기화했으나 여전히 undefined 오류가 있습니다. 제가 누락 된 것이 있습니까?

Answer 1

짐작할 수 있겠지만, 현재 수행중인 작업과 동일 할 수도 있습니다. this.$store.state.isAuth하지만 아래처럼합니다.

내가 모듈을 사용할 때 전에 가지고 있지만 문제가 있었하지 않은 방법으로 저장소를 사용하지 않는 한,이 같은 시도 :

// authModule.js 
const state = { 
    isAuth: true 
} 

const getters = { 
    getIsAuth (state) { 
     return state.isAuth 
    } 
} 

export default { 
    state, 
    getters 
} 

을 다음과 같이 등록합니다 :

import authModule from './modules/authModule' 
export default new Vuex.Store({ 
    modules: { 
     authModule 
    } 
}) 

는 그런 다음 VUE 인스턴스 :

import {mapGetters} from 'vuex' 

computed: { 
    ...mapGetters({ 
     isAuth: 'getIsAuth' 
    }) 
} 

이제 this.isAuth를 통해 액세스 할 수 있습니다. 다음과 같이 액세스 할 수도 있습니다. this.$store.state.authModule.isAuth

이것은 실제로 프로젝트가 커질 때 정리가 잘되어있어 문서에 따라 모범 사례입니다.