How to use getters with Method-Style Access

[Chouche]

Hello !

First of all congratulations for your new born !!!!! Second thank you very much for your work i'm totally a beginner in Web programming and it's really helpful to have people like you ! So thank you very much !!!

Now let's talk about problems ^^ So I have a store/module

const teamStore = {
firestorePath: 'teams',
    firestoreRefType: 'collection', // or 'doc'
    moduleName: 'teamStore',
    statePropName: 'data',
    sync: {
      orderBy: ['totalPoint', 'desc'],
    },
    namespaced: true, // automatically added

    // this object is your store module (will be added as '/myModule')
    // you can also add state/getters/mutations/actions
    state: {
    },
    getters: {
      connectedTeam: (state) => (id) =>  {
        return Object.values(state.data).find(teamId => teamId.teamId === id )
        },
      },
    mutations: {},
    actions: {},
  }

  export default teamStore 

And i wanted to use getters with Method-Style Access so this is what I did :

created() {
    this.$vuetify.theme.dark = true;

    this.teamInfo = store.getters.connectedTeam(this.$route.query.teamId);
  console.log(store.getters)
  },

But I have this error :

Error in created hook: "TypeError: _store_WEBPACK_IMPORTED_MODULE_6.default.getters.connectedTeam is not a function"

I don't know how to do it correctly TT

[mesqueeb]

Hi @Chouche 👋 It seems that you've forgotten to add the module name in your getter.

Try this instead:

this.teamInfo = store.getters['teamStore/connectedTeam'](this.$route.query.teamId);

Good luck 😉

_{--
Vuex Easy Firestore was made with ♥ by Luca Ban.
If you use this library in your projects, you can support the maintenance of this library by a small contribution via Github 💜.
You can also reach out on twitter if you want a one-on-one coding review/lesson. 🦜}

[Chouche]

Oh thank you very much it worked !