DEV Community

Discussion on: Architecting HTTP clients in Vue.js applications for efficient network communication

Collapse
 
haxzie profile image
Musthaq Ahamad

It's the getter defined in the store. Getters acts as computed properties so they're not called like a function.

Collapse
 
sonicoder profile image
Gábor Soós

I know how a simple getter works, you pass in an array and it maps the getters. In your example, there is also the 'Users' before the array element.

Thread Thread
 
haxzie profile image
Musthaq Ahamad • Edited

When we create modules in a Vuex store, that is; you split your store into smaller stores. It's a good idea to namespace them. Eg, if you have an application that has a store, you can create modules inside it for User data, Post data and so on. When you have modules, you need to pass the module name (or the namespace) to get the getter/action from that module to mapping functions. You can read more about this from my previous Article "Architecting Vuex store for large scale Vue.js application".

In simple words, if you want to access the methods in a store module namespaced as Users, you would use Users/getUsers to access the getter. Instead of that, you can simply pass the module name as the first argument for mapGetters/mapActions to access methods from that module as I have used in the example :)

mapGetters(['Users/getUsers'])

is same as

mapGetters('Users', ['getUsers'])
Thread Thread
 
sonicoder profile image
Gábor Soós

Now it's clear, I used the mapGetters(['Users/getUsers']) notation for modules, not the other one

Thread Thread
 
haxzie profile image
Musthaq Ahamad

Awesome! Hope this helped you and hope you learned something handy :)