admin 管理员组

文章数量: 1086019

I am trying to improve vuex module but getting error below:

Uncaught Error: [vuex] getters should be function but "getters.getComments" in module "ments" is [].

/stores/ments.js (module)

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

Vue.use(Vuex);

const state = {
    ments: []
}

const getters = {
    getComments: state => statements
}
const mutations = {
    setComments(state, ments) {
        statements = ments
    }
}

const actions = {
    setComments(context, data) {
        contextmit('setComments', data)
    }
}
export default new Vuex.Store({
    state,
    getters,
    mutations,
    actions
})

and here is my store.js that contains root state of the vuex store.js

import Vue from 'vue';
import Vuex from 'vuex';
import mentsModule from './stores/ments'
Vue.use(Vuex);
const state = {
}

const getters = {
}

const mutations = {
}

const actions = {

}

export default new Vuex.Store({
    state,
    getters,
    mutations,
    modules: {
        ments: mentsModule
    },
    actions
})

Can you please help me to solve this issue. Tried but not understand what is the issue?

I am trying to improve vuex module but getting error below:

Uncaught Error: [vuex] getters should be function but "getters.getComments" in module "ments" is [].

/stores/ments.js (module)

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

Vue.use(Vuex);

const state = {
    ments: []
}

const getters = {
    getComments: state => state.ments
}
const mutations = {
    setComments(state, ments) {
        state.ments = ments
    }
}

const actions = {
    setComments(context, data) {
        context.mit('setComments', data)
    }
}
export default new Vuex.Store({
    state,
    getters,
    mutations,
    actions
})

and here is my store.js that contains root state of the vuex store.js

import Vue from 'vue';
import Vuex from 'vuex';
import mentsModule from './stores/ments'
Vue.use(Vuex);
const state = {
}

const getters = {
}

const mutations = {
}

const actions = {

}

export default new Vuex.Store({
    state,
    getters,
    mutations,
    modules: {
        ments: mentsModule
    },
    actions
})

Can you please help me to solve this issue. Tried but not understand what is the issue?

  • javascript
  • vue.js
  • vuex
Share Improve this question edited Oct 29, 2017 at 13:09 kaankilic asked Oct 29, 2017 at 11:21 kaankilickaankilic 69413 silver badges33 bronze badges 4
  • should not create a new Store inside a module file, and then export a new store to a supposedly the store itself. the code of the store itself is missing. – LiranC Commented Oct 29, 2017 at 12:05
  • @LiranC actually, its not missing. I didn't shared the store.js because it's only includes the module inside of it – kaankilic Commented Oct 29, 2017 at 12:09
  • i think you should include it, something is strange. – LiranC Commented Oct 29, 2017 at 12:16
  • @LiranC I've add it on post – kaankilic Commented Oct 29, 2017 at 12:19
Add a ment  | 

2 Answers 2

Reset to default 9
  • You are creating store instance in store.js which is good
  • You are creating another store instance inside ment.js which is not good

As a start, Try to Change the export block on ment.js to this:

export default {
    state,
    getters,
    mutations,
    actions
}

Try this more modular way ;) :

Move your getters to an external module.

for example in app/js/store/getters.js:

export const getComments = state => {
    return state.ments;
};

And inside of app/js/store/index.js for example:

import Vue from 'vue';
import Vuex from 'vuex';
import * as getters from './getters';

Vue.use(Vuex);

export default new Vuex.Store({
    state: {
        ments: [],
    },
    getters,
    // ...
});

本文标签： javascriptHow to define getters on vuex moduleStack Overflow

版权声明：本文标题：javascript - How to define getters on vuex module? - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.roclinux.cn/p/1744043784a2523741.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。