반응형
매핑된 getter가 정의되지 않았습니다.
getters 세트를 컴포넌트에 매핑하고 메서드에서 파라미터를 사용하여 호출하려고 하는데 getters가 정의되지 않은 상태로 표시됩니다.이전 질문의 답변에 따라 지도를 작성했습니다.
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);
}
이것을 시험해 보세요.
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)
},
}
또한 getter는 다음과 같은 ID를 필요로 하는 함수여야 합니다.
getCategory: (state) => (id) => {
return state.categories.filter(category => category.id === id);
}
Method-Style Access에 대해서는 문서를 참조해 주십시오.
설명서에 따르면 오브젝트 스타일액세스 기능을 사용하기 위해 이 기능을 리팩터링할 수 있습니다.
...mapGetters({
// map `this.doneCount` to `this.$store.getters.doneTodosCount`
doneCount: 'doneTodosCount'
})
고객님의 경우:
computed: {
...mapGetters('products', {
products: 'getCategoryProducts'
}),
...mapGetters('categories', {
subCategories: 'getSubcategories',
category: 'getCategory'
}),
}
그런 다음 이를 사용합니다(이러한 getter에 인수가 있다고 가정).
this.products(this.id)
쇼핑 카트의 예를 살펴보았습니다.이것이 그 스니펫입니다.상기에 일치하도록 갱신했습니다.
...mapGetters('cart', {
products: 'cartProducts',
total: 'cartTotalPrice'
})
언급URL : https://stackoverflow.com/questions/52945195/mapped-getters-are-undefined
반응형
'programing' 카테고리의 다른 글
여러 구성 요소가 Vuex에서 동일한 작업을 사용하여 데이터를 가져오는 경우 상태를 처리하는 방법은 무엇입니까? (0) | 2022.08.30 |
---|---|
최종 정적 최종과 정적 최종의 차이 (0) | 2022.08.30 |
Vue.js 2.5+에서 Vuetify와 함께 Vue-IMASK를 사용하는 방법 (0) | 2022.08.28 |
ISO/IEC 웹사이트 및 C 및 C++ 규격에 대한 과금 (0) | 2022.08.28 |
OS X에서의 LLVM과 Clang (0) | 2022.08.28 |