Я сопоставил набор геттеров с моим компонентом и пытаюсь вызвать их с параметром в методах, однако геттеры не определены. Я сопоставил их после ответа на предыдущий вопрос
computed: {
...mapGetters([
'products/getCategoryProducts',
'categories/getSubcategories',
'categories/getCategory'
]),
products () {
return this['products/getCategoryProducts'](this.id)
},
subCategories () {
return this['categories/getSubcategories'](this.id)
},
category () {
return this['categories/getCategory'](this.id)
},
}
Ошибка:
TypeError: this.categories / getCategory не является функцией
Я зарегистрировал в консоли this:
Изменить: обновленный код после ответа @Luceos:
computed: {
...mapGetters({
getProducts: 'products/getCategoryProducts',
getSubCategories: 'categories/getSubcategories',
getCategory: 'categories/getCategory'
}),
products () {
return this.getProducts(this.id)
},
subCategories () {
return this.getSubCategories(this.id)
},
category () {
return this.getCategory(this.id)
},
}
Который возвращает:
TypeError: this.getCategory не является функцией
Мой получатель:
getCategory: (state, id) => {
return state.categories.filter(category => category.id === id);
}
2 ответа
Попробуй это:
computed: {
...mapGetters({
products: 'products/getCategoryProducts',
subcategories: 'categories/getSubcategories',
category: 'categories/getCategory'
}),
products () {
return this.products(this.id)
},
subCategories () {
return this.subcategories(this.id)
},
category () {
return this.category(this.id)
},
}
И ваши геттеры должны быть функциями, ожидающими идентификатор, например:
getCategory: (state) => (id) => {
return state.categories.filter(category => category.id === id);
}
Обязательно ознакомьтесь с документами. Доступ в стиле метода
Согласно документации, вы можете выполнить рефакторинг для использования стиля объекта аксессоры :
...mapGetters({
// map `this.doneCount` to `this.$store.getters.doneTodosCount`
doneCount: 'doneTodosCount'
})
Итак, в вашей ситуации:
computed: {
...mapGetters('products', {
products: 'getCategoryProducts'
}),
...mapGetters('categories', {
subCategories: 'getSubcategories',
category: 'getCategory'
}),
}
Затем используйте это (при условии, что у этих геттеров есть аргументы):
this.products(this.id)
Я просмотрел корзину для покупок пример, это их фрагмент, обновленный для соответствия:
...mapGetters('cart', {
products: 'cartProducts',
total: 'cartTotalPrice'
})