Possible can i use composition api and vue-property-decorator typescript together?

[Nguyen Manh Cuong]

[Nguyen Manh Cuong]

I use setup function in
export default class class_name extends Vue { setup() {} }
but it's not working?

[Patryk Wałach]

Not sure if It'll help or not, but you should start by registering the hook,

Component.registerHooks([
  'setup'
])

[Nguyen Manh Cuong]

Not sure if It'll help or not, but you should start by registering the hook,

Component.registerHooks([
  'setup'
])

where i can place it? main.js right?

[Renaud Merle]

Yes, in main.js I've:

import Component from 'vue-class-component'

Component.registerHooks(['setup', 'beforeRouteUpdate', 'beforeRouteEnter', 'beforeRouteLeave'])

[Nguyen Manh Cuong]

thank for your help :)

[Carlos Rodrigues]

Seems the issue is resolved, if not, please reopen or create a new issue.

---

Remember to use the forum or the Discord chat to ask questions!

[Bruno Francisco]

I have done the following:

main.js

import Component from 'vue-class-component';
// On why we do this visit: https://github.com/vuejs/composition-api/issues/136
Component.registerHooks(['setup']);

Then on my component:

import { Component, Vue } from 'vue-property-decorator';

@Component
export default class MyComponent extends Vue {
   setup() {
       console.log('setup function executed');
   }
}

But the console log never shows. Any idea?

If I move the setup method to the options it works:

@Component({ setup() { console.log('hello from setup') }  })

[Bernhard Schlegel]

Hey @CharlieBrownCharacter since setup has no this available ("Because the component instance is not yet created when setup is executed, there is no this inside a setup option.", source: official doc) I think it makes sense for it to reside in the @Component decorator and not in the actual class where you might be tempted to use an (undefined) this operator.

[Nick]

Unfortunately, I have problems with type validation in that scenario using Vue 2 with @vue/composition-api

Any thoughts on that, guys?

[Bogdan]

@pikax ,
Unfortunately in our project we have the same issue as @fobdy described.
So could you please reopen this ticket?

Btw, as for me setup as a static method would be the best solution.

Thanks

[Carlos Rodrigues]

That seems to be an issue using the vue-property-decorator which is not maintained or supported by us, if you can reproduce using the defineComponent provided by @vue/composition-api I can have a look on it.

[yoyoIU]

Unfortunately, I have problems with type validation in that scenario using Vue 2 with @vue/composition-api

Any thoughts on that, guys?

TypeScript can't support any method for let decorator effect type.
So you should consider other ways.
Maybe vuejs/vue-class-component#465?