[Vue v3] Changes for @Component decorator and Vue base class

## Summary - `@Component` will be renamed to `@Options`. - `@Options` is optional if you don't declare any options with it. - `Vue` constructor is provided from `vue-class-component` package. - `Component.registerHooks` will move to `Vue.registerHooks` Example: ```vue <template> <div>{{ count }}</div> <button @click="increment">+1</button> </template> <script> import { Vue, Options } from 'vue-class-component' // Component definition @Options({ // Define component options watch: { count: value => { console.log(value) } } }) export default class Counter extends Vue { // The behavior in class is the same as the current count = 0 increment() { this.count++ } } </script> ``` ```js // Adding lifecycle hooks import { Vue } from 'vue-class-component' Vue.registerHooks([ 'beforeRouteEnter', 'beforeRouteLeave', 'beforeRouteUpdate' ]) ``` ## Details As Vue v3 no longer provides base `Vue` constructor, Vue Class Component will provide it instead. Fortunately, we can add class component specific features in the base class as we define it in Vue Class Component package. One of the benefits with the new `Vue` constructor is we can make `@Component` decorator optional. There were non-trivial number of confusions regarding missing `@Component` decorator in super class / mixins (e.g. #180). Making decorator optional would solve this problem. Also renaming `@Component` with `@Options` would make more sense as it is for adding component opti

Posted by ktsn on Mar 19, 2020, 11:37 AM

Tags

• github (Other)

Related issues

• struct's lifetime requirements can be bypassed via covariant field assignment
• Proposal to Reorganize the Moderation Team and Review Moderation Policies
• Progressive FPS degradation appears to be related to dota2.com — blocking the domain prevents the performance loss
• proposal: container/...: generic collection types
• Better Custom Endpoint BYOK
• A concrete policy for backward compatibility until Godot 5.0