Почему массив пустой?

Question

[Павел Сидоров]

Использую nuxt и пытаюсь из vuex получить массив с данными, но он пустой.

vuex index.js:

export const state = () => ({
  categoriesList: [

  ]
})

export const mutations = {
  SET_CATEGORIES_LIST (state, apiCategories)  {
    state.categoriesList = apiCategories
    //state.categoriesList.push(categories)
  }
}

export const actions = {
  async getCategoriesList({ commit }) {
    const apiCategories = await this.$axios.$get('https://jsonplaceholder.typicode.com/todos');
    commit('SET_CATEGORIES_LIST', apiCategories);
    return apiCategories;
  }
}

Компонент, где получаю все это и пытаюсь вывести:

<template>
  <div>
    <p>ntcn</p>
    <ul class="d-flex flex-column"
        v-for="category in categoriesList"
        :key="category.id"
    >
      <li>
        <nuxt-link :to="`/category/${category.userId}`" class="d-flex justify-content-start align-items-center">
          <span>{{ category.title }}</span>
        </nuxt-link>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  name: "menuItem",
  computed: {
    categoriesList() {
      return this.$store.state.categoriesList
    },
  },
}
</script>

И ничего. Массив пустой. Почему?
Если я просто что-то положу во vuex state в массив categoriesList, то все будет гуд, значит траб где то actions, наверно.

Comments

[Константин Б.]

Так экшен для загрузки данных вызвать где-то нужно чтобы он отработал

[Павел Сидоров]

Константин Б., явно , наверно, вызывать не в хранилище

[Павел Сидоров]

Константин Б., типо dispatch