programing

매핑된 getter가 정의되지 않았습니다.

goodcopy 2022. 8. 28. 19:00
반응형

매핑된 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:

console.log(이것)

console.log(이것)는 계속되었습니다.

편집: @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

반응형