Vuex 在组件调用this.$store.state.xx.xx undefind

Question

state.jsstate:{    data:{}}mutation.jstype.data (state, arg) {    return state.data = arg}action.jscommit(types.data, {a: 111, b: 222})getters.jsexport const data = (state) => {    return state.data}在组件的methods方法中调用,非模板template里.this.$store.getters.data       //{a:111, b:222}this.$store.state.data       //{a:111, b:222}但是,直接调取值就不可以.this.$store.getters.data.a     // undefinedthis.$store.state.data.a       // undefined请教一下,怎么在组件中可以直接调用啊~?

Answer 1

state.js
state: {
   remind: {}
}

mutation_types.jsexport const REMAIND = 'REMAIND'mutation.js
[type.REMIND] (state, arg) {
    state.remind = arg
}

actions.js
getdata ({state, commit}, arg) {
    ...,
    commit(types.REMAIND, {free: res.data.freeNum, queue: res.data.queueNum})
}


getters.jsexport const remind = (state) => {    return state.remind
}

test.vue
methods:{
   submit () {       this.$store.dispatch('getData')       console.log(this.$store.getters.remind)       // {obj....arry(0)}
       console.log(this.$store.getters.remind.free)   // undefined
       console.log(this.$store.getters.remind.queue)  // undefined
   }
}

点击submit 第一次得到的都是空
第二次点击submit的是时候,就都有值了..
state,和 getters 都是这样的,为什么呢?