Использую 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, наверно.