Access vue vuex namespaced getter from template

Question

I have made vuex namespaced getter mapping in my .vue component like this:

...mapGetters([   'fooModule/barGetter' ]) 

How do I access this getter in the .vue component template? I have tried {{fooModule.barGetter}} but it doesn't seem to work, {{fooModule/barGetter}} is obviously wrong.

I could assign another key to the getter in mapGetters by

...mapGetters({     fooBarGetter: 'fooModule/barGetter' }) 

This allows me to access the value in the template by using {{forBarGetter}}

However, I am wondering if there is a way to access the 'fooModule/barGetter' without assigning it another key. Is it possible? if so how?

Answer 1

The first parameter of mapGetters can be a namespace:

computed: {     ...mapGetters("fooModule", [         "barGetter"     ]),     ...mapGetters("anotherModule", [         "someGetter"     ]) } 

That will make the value available as this.barGetter or just barGetter in templates. Note, it's perfectly acceptable to have multiple mapGetters statements.

Vuex Getters documentation

Vuex Binding helpers with namespace