This is the explanation of my store module.
// rest defined earlier
const _GETTERS = {
getName: state => {
return state.current.name;
},
getLastName: state => {
return state.current.lastName;
},
getFullName: (state, getters) => {
// return `${state.current.name} ${state.current.lastName}`;
return `${getters.getName()} ${getters.getLastName()}`;
},
getMailAddress: state => {
return state.current.mailAddress;
}
};
const UsersStore = {
...
getters: _GETTERS
};
The above code snippet represents my user-store
module. I encountered an error stating
Uncaught TypeError: getters.getName is not a function
. However, changing the code to access the state
instead of the getters
resolved the issue. Below is the main store object where I include the module.
export default new Vuex.Store({
strict: process.env.NODE_ENV !== 'production',
state: _state,
getters: _getters,
actions: _actions,
mutations: _mutations,
modules: {
users: UserStore
}
});
Rendering this section works perfectly fine when directly accessing the store without utilizing getters.
import {Component, Vue} from 'vue-property-decorator';
import {mapGetters} from 'vuex';
const template = require('./app-footer.vue').default;
@Component({
mixins: [template],
computed: {
...mapGetters({
name: 'getFullName'
})
}
})
export default class AppFooter extends Vue {
}