Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Inject decorator doesn't work in javascript #37

Open
dirodriguezm opened this issue Feb 13, 2021 · 3 comments
Open

Inject decorator doesn't work in javascript #37

dirodriguezm opened this issue Feb 13, 2021 · 3 comments
Labels
bug Something isn't working

Comments

@dirodriguezm
Copy link

Hello, first I want to say thanks for this tool.

I'm making some sample projects to use inversify-props with Nuxt, both in Typescript and Javascript. I've succsesfully achieved what I wanted to try in this sample repo with Typescript.

The thing is that when I try to use @inject('SomeService') someService in a javascript es6 class, the property is not created (someService is undefined), but if I use someService = container.get(cid.SomeService) then it works fine.

I don't know if it's my fault or something else.

All help would be appreciated, thanks in advance !

@CKGrafico
Copy link
Owner

Hello and thanks for your issue, did you try @inject(cid.SomeService) someService?
Can you create a sandbox to reproduce the issue?

@CKGrafico CKGrafico added the bug Something isn't working label Feb 13, 2021
@dirodriguezm
Copy link
Author

Hi, thanks for the reply. I was a bit wrong, I just discovered that it works with regular es6 classes but not with Vue classes decorated with vue-class-component or vuex store modules decorated with vuex-module-decorators.

Also, note that it works fine with typescript in decorated vue components.

I have a repository with a demo. As you can see I have this class that is working fine:

export class Storage {
  @inject('StoreCreator') storeCreator

  getStores() {
    const store = this.storeCreator.makeStore()
    return { sampleStore: getModule(SampleStore, store) }
  }
}

But if I try to inject into this Vuex module, it wont work, and have to use container.get like this:

@Module({
  namespaced: true,
  stateFactory: true,
  name: 'sample',
})
class SampleStore extends VuexModule {
  // @inject(cid.SampleService) sampleService <--- sampleService undefined
  sampleService = container.get(cid.SampleService)
  greeting = ''

  @VuexMutation
  setGreeting(greeting) {
    this.greeting = greeting
  }

  @VuexAction({ rawError: true })
  useService() {
    this.setGreeting(this.sampleService.sayHi())
  }
}

It's not that I can't use it that way, but it would be nice to keep a consistent usage in all classes with inject. I don't know if this is something that can be fixed, but if you can think on a solution, please tell me.

Thanks again.

@CKGrafico
Copy link
Owner

mmm I've to admit that I didn't checked with vue, if you can prepare the sandbox I'll check soon sorry!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

2 participants