CODEWITHSUNDEEP
vue.jsvuex
Nadirbek Nazaraly
Nadirbek Nazaraly

Reputation: 65

Vuex and vuex getters with arguments

I have a small app based on Vue and Vuex. Its just a table with items like that

<div class='items'>
  <div v-for='item in items'>
    <span> {{ item.name }} </span>
    <router-link :to='"update/" + item.id'>Edit</router-link>
  </div>
</div>

Items array is loaded from Vuex state using getters. So the problem is that when i press the 'edit' button, it redirects me to another page, where i have a function like that

computed() {
  item() {
    return this.$store.getters.get_item(this.$route.params.id)
  }
}

and generally it should work (i have tested it by passing some numbers instead of "this.$route.params.id") but its not.. why? no errors, nothing, just empty array

my get_item function

getters: {
  get_item: (state) => (index) => {
    return state.items.filter((item) => {
      return item.id === index
    }
  }
}

Upvotes: 3

Views: 3319

Answers (1)

Batato
Batato

Reputation: 568

You are defining computed as a function while it's supposed to be an object. Try instead: 

computed: {
  item() {
    return this.$store.getters.get_item(this.$route.params.id)
  }
}

Upvotes: 2

Related Questions