码迷,mamicode.com
首页 > 其他好文 > 详细

[Vue + TS] Create your own Decorators in Vue with TypeScript

时间:2017-09-14 21:55:03      阅读:282      评论:0      收藏:0      [点我收藏+]

标签:through   vue   ever   tin   nali   UI   data-   fine   order   

We’ve used @Watch, @Inject and more decorators from vue-property-decorator. In this lesson however we will guide you through creating your own decorators in order to add common functionality to your Vue components using TypeScript.

 

Import:

import {createDecorator} from ‘vue-class-component‘

 

Define a decorator:

const Log = (msg) => {
  return createDecorator((component, key) => {
    console.log("#Component", component);
    console.log("#Key", key); //log
    console.log("#Msg", msg); //App
  })
}

 

Using it:

  @Log(‘fullMessage get called‘)
  get fullMessage() {
    return `${this.message} from Typescript`
  }

 

Output:

#Component Object {directives: Object, components: Object, name: "Hello", methods: Object, computed: Object…}
#Key fullMessage
#Msg fullMessage get called

 

[Vue + TS] Create your own Decorators in Vue with TypeScript

标签:through   vue   ever   tin   nali   UI   data-   fine   order   

原文地址:http://www.cnblogs.com/Answer1215/p/7522547.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!