File tree Expand file tree Collapse file tree 3 files changed +36
-0
lines changed Expand file tree Collapse file tree 3 files changed +36
-0
lines changed Original file line number Diff line number Diff line change 20
20
- TSX
21
21
- [ TSX render] ( /pt-br/tsx/tsx-render/tsx-render.md )
22
22
- [ Tipando Atributos] ( /pt-br/tsx/attribute-types/attribute-types.md )
23
+ - Custom Decorator
24
+ - [ Custom Decorator] ( /pt-br/custom/custom.md )
23
25
- Compatibilidade
24
26
- [ reflect-metadata] ( /pt-br/compatibility/reflect-metadata/reflect-metadata.md )
Original file line number Diff line number Diff line change
1
+ import { createDecorator , Component , Vue } from 'vue-facing-decorator'
2
+
3
+ function Log ( prefix : string ) {
4
+ return createDecorator ( function ( options , key ) {
5
+ const old = options . methods ?. [ key ]
6
+ if ( ! old ) {
7
+ throw 'not found'
8
+ }
9
+ options . methods [ key ] = function ( ...args : any [ ] ) {
10
+ old . apply ( this , args )
11
+ }
12
+ } )
13
+ }
14
+
15
+ @Component
16
+ export default class Comp extends Vue {
17
+ @Log ( 'prefix' )
18
+ method ( ) {
19
+
20
+ }
21
+ }
Original file line number Diff line number Diff line change
1
+ ## Utilização
2
+
3
+ Use ` createDecorator ` para construir seus próprios decorators.
4
+
5
+ Se você é um autor de algum package, instale vue-facing-decorator como ` devDependecies ` e marque-a dentro de ` peerDependencies ` .
6
+
7
+
8
+ ` createDecorator ` recebe uma função criadora, a qual aceita dois parâmetros:
9
+
10
+ 1 . Componentes Vue gerados com options API, você pode modifica-lo para implementar o que você quiser.
11
+ 2 . A key da propriedade da classe(ou método), o qual o decorator irá ser aplicado.
12
+
13
+ [ ] ( ./code-usage.ts ' :include :type=code typescript ')
You can’t perform that action at this time.
0 commit comments