I'm new to vue and vuex and I'm also using Nuxt. I want to use a function in my template that searches for some data that I fetched from an API (in vuex). I can't figute out why I always get
state.allHandhelds.values.findIndex is not a function
My template is like this:
<div>{{ handheldID("Form Factor") }}</div>
And in my computed I call the function like this:
computed: {
...mapGetters(["allHandhelds"]),
handheldID(merkmal) {
return this.$store.getters.indexFinder(merkmal);
},
},
In vuex I have it defined as a getter:
export const getters = {
indexFinder(state, merkmal) {
return state.allHandhelds.values.findIndex(
(el) => el === merkmal
); /* Index des Merkmals finden */
},
};
Any idea where I'm going wrong with that?
You've to use the method access style like :
export const getters = {
indexFinder: (state) => (merkmal) => {
return state.allHandhelds.values.findIndex(
(el) => el === merkmal
);
}
};
or with syntax :
export const getters = {
indexFinder(state) {
return (merkmal)=> {
return state.allHandhelds.values.findIndex(
(el) => el === merkmal
); /* Index des Merkmals finden */
}
},
};