Y
Y
YakovSpb2020-11-28 22:39:16
Vue.js
YakovSpb, 2020-11-28 22:39:16

Why is there nothing in my store?

https://github.com/YakovSPb/Vue_Nuxt_Copters

in the store file

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
}


in Main.vue file
<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>

Answer the question

In order to leave comments, you need to log in

2 answer(s)
D
Dima Pautov, 2020-11-28
@bootd

This is

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

replace with this
if (store.getters['copters/copters'].length === 0)

A
Alexey, 2020-11-29
@AlexeyCaTHaR

Cloned the turnip.
the question arises, why do you think that in async fetch () you have a store ???
twisted it to start. it happened like this.

<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, а пушишь в роутер?

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question