ktsn / vuex-class

Binding helpers for Vuex and vue-class-component
MIT License
1.73k stars 86 forks source link

Cannot invoke an expression whose type lacks a call signature. Type 'void' has no compatible call signatures. #33

Closed builder7777 closed 5 years ago

builder7777 commented 5 years ago

I am getting an error when trying to call an action from store:

import { Component, Vue, Watch } from 'vue-property-decorator';
import { Action } from 'vuex-class';

@Component
export default class extends Vue {
  @Action('itemsFetch', { namespace: 'MainMenu' }) private getMenuItems!: void;

  private mounted() {
    this.getMenuItems();
  }
}

The compiler is complaining about this.getMenuItems() method call:

Cannot invoke an expression whose type lacks a call signature. Type 'void' has no compatible call signatures.

The MainMenu.ts has the following action signature:

const actions: ActionTree<MenuState, RootState> = {
   // ... other actions ...
    itemsFetch({ commit }): void {
        // ... get some test items ...
        commit('itemsUpdate', items);
    },
};

I also tried using @menuModule.Action private itemsFetch!: void; instead of specifying namespace in the decorator - same result.

Am I not using this right or something else is going on?

ktsn commented 5 years ago

Because you declare getMenuItems as void type. Please annotate actual function type.

@Action(...) private getMenuItems!: () => void
Uriziel01 commented 5 years ago

@ktsn Sorry for digging up old topic, how to use action that take a payload?

I'm gettting Expected 0 arguments, but got 1. ERROR when declaring it just like that:

@Action private loginUser!: () => void

private authenticate (): void {
  this.loginUser({email:this.email, password: this.password});
}
tehbilly commented 5 years ago

I believe you'd change it to:

@Action private loginUser!: (args: any) => void;