Unable to access Vuex gamers outside of modules

Question

I cannot access getters from one of my Vuex modules in my component, although I can see getters in Vue Dev Tools.

My store.jsfile:

import Vue from 'vue';
import Vuex from 'vuex';
import subsub from './modules/subsub';

Vue.use(Vuex);
export default new Vuex.Store({
  state: { },
  actions: { },
  mutations: { },
  getters: { },
  modules: {
    subsub,
  },
});

My modules/subsub.jsfile:

const state = {
  categories: [{
    name: 'one',
    path: 'two',
    ...
  }, {
    name: 'twocat',
    path: 'two',
    ...
  }],
};

const actions = { };
const mutations = { };
const getters = {
  filterCategories(state) {
    return state.categories;
  },
  filtertwo(state) {
    const filteri = state.categories.filter((catee) => {
      return catee.name === 'twocat';
    });
    return filteri;
  },
};

export default {
  namespaced: true,
  state,
  actions,
  mutations,
  getters,
};

My component:

<template>
  <div> {{ filterCategories }} </div>
</template>

<script>    
import { mapGetters } from 'vuex';

export default {
  computed: {
    ...mapGetters([
      'categories',
      'filtertwo',
      'filterCategories',
    ]),
    filtertwo() {
      return this.$store.getters.filtertwo;
    },
    filterCategories() {
      return this.$store.getters.filterCategories;
    },
  },

</script>

So what am I missing? Is there any other syntax for accessing getters from modules?

Answer 1

First, you do not have a recipient for categories, so you need to add it.

Secondly, your subsubmodule has a property namespacedset to true. This means that you need to provide the module name to the helper mapGetter:

...mapGetters('subsub', [
  'categories',
  'filtertwo',
  'filterCategories',
]),

-, mapGetters filtertwo filterCategories. , $store.getters. , undefined. , :

filtertwo() {
  return this.$store.getters['subsub/filtertwo'];
},
filterCategories() {
  return this.$store.getters['subsub/filterCategories'];
},

Answer 2

, thnx, @thanksd

, namespaced true,

filterCategories() {
      return this.$store.getters['subsub/filterCategories'];
    },

, , namespaced false. , .