Почему у меня в store ничего нет?

Question

[YakovSpb]

https://github.com/YakovSPb/Vue_Nuxt_Copters

В файле store:

export const state = () => ({
  copters: []
})

export const mutations = {
  setUsers(state, copters) {
    state.copters = copters
  }
}

export const actions = {
  async fetch({commit}) {
    const copters = await this.$axios.$get('https://jsonplaceholder.typicode.com/users')
    commit('setUsers', copters)
  }
}

export const getters = {
  copters: s => s.copters
}

В файле Main.vue:

<script>
export default {
  async fetch({store}) {
    if (store.copters['copters/copters'].length === 0) {
      await store.dispatch('copters/fetch')
    }
  },
  data: () => ({
    pageTitle: 'Users page'
  }),
  computed: {
    copters() {
      return this.$store.getters['copters/copters']
    }
  },
  methods: {
    openUser(user) {
      this.$router.push('/copters/' + user.id)
    }
  }
}
</script>

Comments

[Alex]

А геттер вам зачем? Что отображается в отладчике? action запускается? Мутация? Что возвращает сервер в ответ на запрос?

[YakovSpb]

как я понял запроса нет что-ли

Как проверить запускается ли action или мутация?

Answer 1

[Дима Паутов]

Это

if (store.copters['copters/copters'].length === 0) {

заменить на это
if (store.getters['copters/copters'].length === 0)

Comments

[YakovSpb]

заменил уже.. не то

Answer 2

[Алексей]

Клонировал репу.
возникает вопрос, почему ты думаешь, что в async fetch() у тебя есть store???

покрутил, чтобы запустилось. получилось так.

<script>
import {mapGetters} from 'vuex'
export default {
  async fetch() {
    if (this.copters.length === 0) {
      await this.$store.dispatch('copters/fetch')
    }
  },
  data: () => ({
    pageTitle: 'Users page'
  }),
  computed: {
    ...mapGetters('copters', ['copters']),
  },
  methods: {
    openUser(user) {
      this.$router.push('/copters/' + user.id)
    }
  }
}
</script>

А почему ты не хочшь использовать nuxt-link, а пушишь в роутер?