vue.js 未定义Map的getter

dnph8jn4 于 2023-08-07 发布在 Vue.js

关注(0)|答案(3)|浏览(196)

我已经将一组getterMap到我的组件中，并试图在方法中使用参数调用它们，但是getter显示为undefined。我把它们Map到了previous question上的一个答案

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：
x1c 0d1x的数据

的
编辑：更新了代码，如下@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);
}

型

vue.js

来源：https://stackoverflow.com/questions/52945195/mapped-getters-are-undefined

3条答案

按热度按时间

pw136qt21#

试试这个：

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);
}

型
请务必查看文档方法式访问

赞(0）回复(0）举报 2023-08-07

42fyovps2#

根据文档，你可以重构它以使用对象样式的访问器：

...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)

型
我看了一下shopping cart example，这是他们的片段，更新了上面的内容以匹配：

...mapGetters('cart', {
      products: 'cartProducts',
      total: 'cartTotalPrice'
    })

型

赞(0）回复(0）举报 2023-08-07

q0qdq0h23#

我犯了这个错误：
第一个月
我注意到我的导入是默认导入。所以是这样的
import mapGetters from "vuex";个
转向命名导入并解决问题：
import {mapGetters} from "vuex";个

赞(0）回复(0）举报 2023-08-07

我来回答

vue.js 未定义Map的getter

3条答案

相关问题

热门标签

最新问答