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 都是这样的,为什么呢?