Почему я получаю неопределенный при передаче параметра в сопоставленный получатель?

Question

У меня настроено несколько геттеров, вы передаете им идентификатор, и они возвращают соответствующие данные.Поэтому я сопоставил их с компонентом, однако при передаче параметра параметр не определен.

Компонент:

<template>
    <div>
        <h1>{{ category.name }}</h1>
    </div>
</template>

<script>
    import { mapGetters } from 'vuex'

    export default {
        props: ['id'],

        computed: mapGetters({
            subCategories: ['categories/getSubcategories'](this.id),
            category: ['categories/getCategory'](this.id)
        })
    }
</script>

Получатель:

getCategory: (state, id) => {
    return state.categories.filter(category => category.id === id);
},

ОшибкаСуществование:

Невозможно прочитать свойство 'id' из неопределенного

Если я передам ему жестко закодированный параметр, например, category: ['categories/getCategory'](106), то получу:

['category / getCategory'] не является функцией

Где я тут ошибаюсь?

РЕДАКТИРОВАТЬ: Вот мой магазин:

Answer 1

В соответствии с этой проблемой GitHub кажется, что вам нужно вернуть функцию в получатель, а затем вызвать метод в вычисляемом свойстве, то есть получателе:

getCategory: state => {
  return id => state.categories.filter(category => category.id === id);
}

А потом в computed свойство:

computed: {
  ...mapGetters([
    'categories/getSubcategories', 
    'categories/getCategory'
  ]),
  subCategories () {
    return this['categories/getSubcategories'](this.id)
  },
  category () {
    return this['categories/getCategory'](this.id)
  }
}