ktsn/vuex-class

Does Vuex-class have to be used within a Vue component? How do I use vuex-class in just a generic TypeScript/JavaScript file?

carsnwd opened this issue · 2 comments

Fairly new to Vue, prototyping a Vue app for a possible migration to Vue.

Something we would like to do is keep as much business logic away from UI logic. Is there a way I can interact with Vuex using this vuex-class library decorators in a separate just .ts/.js file? So like creating some ES class, and having a store, getter, mutations, etc in it to interact with my Vuex state?

//fooService.ts  .......or something like that
import ...

export default class FooService {
  @FooModule.State
  private FooModel!: FooModel;

  @FooModule.Getter
  private foo!: Foo;

  @FooModule.Mutation
  private setFoo!: (newFoo: Foo) => void;

  private doFooBusinessLogic(){ ... }

}

And then in the Vue component just initializing this class and calling it to interact with this Vuex data.

Rather than having to do ALL interactions with Vuex within a Vue component.

Thanks.

I can do this with just the Vuex store, but not using all the decorators and such. I think without them, I have to call it with module/mutation for example to execute a mutation?

//fooService.ts  .......or something like that
import ...
import store from ...

export default class FooService {
  private doFooBusinessLogic(){ 
    store.commit("FooVuexModule/setFoo",  true);
  }

}

Was able to accomplish this using this library instead https://github.com/gertqin/vuex-class-modules