категории и подкатегории vuejs

с апи получаю список категорий, почему-то не выводятся отфильтрованные подкатегории (SUB_CATS), мб я их не правильно передаю в компонент?

export const getters = {
  ALL_CATS(state){
    return state.categories;
  },
  MAIN_CATS(state){
    return state.categories.filter(c => c.parent_id === 0);
  },
  SUB_CATS: state => id => {
    return state.categories.filter(c => c.parent_id === id);
  },
};
import {mapActions, mapGetters} from 'vuex'
  export default {
    computed: {
      ...mapGetters([
        'ALL_CATS',
        'MAIN_CATS',
        'SUB_CATS',
      ]),
    },
    methods: {
      ...mapActions([
        'GET_CATEGORIES'
      ]),
    },
    mounted() {
      this.GET_CATEGORIES()
    },
  }
<div class="menu">
      <div class="menu-title">
        <nuxt-link to="/allcats/">Все категории</nuxt-link>
      </div>
      <ul class="menu-list">
        <li class="menu-item"
            v-for="category in MAIN_CATS"
            :key="category.id">
          <nuxt-link :to="`/category/${category.id}`" class="menu-button">{{ category.title }} {{ category.id}}</nuxt-link>
          <ul class="menu-sub-list">
            <li class="menu-item"
                v-for="sub in SUB_CATS"
                :key="sub.title">
              <nuxt-link :to="`/category/${sub.id}`" class="menu-button">{{ sub.title }} {{sub.id}}</nuxt-link>
            </li>
          </ul>
        </li>
      </ul>
  </div>

введите сюда описание изображения


Ответы (0 шт):