docs-pr-br: createDecorator

Author: bhssilva-star

docs/pt-br/_sidebar.md

@@ -20,5 +20,7 @@
 - TSX
     - [TSX render](/pt-br/tsx/tsx-render/tsx-render.md)
     - [Tipando Atributos](/pt-br/tsx/attribute-types/attribute-types.md)
+- Custom Decorator
+    - [Custom Decorator](/pt-br/custom/custom.md)
 - Compatibilidade
     - [reflect-metadata](/pt-br/compatibility/reflect-metadata/reflect-metadata.md)

docs/pt-br/custom/code-usage.ts

@@ -0,0 +1,21 @@
+import { createDecorator, Component, Vue } from 'vue-facing-decorator'
+
+function Log(prefix: string) {
+    return createDecorator(function (options, key) {
+        const old = options.methods?.[key]
+        if (!old) {
+            throw 'not found'
+        }
+        options.methods[key] = function (...args: any[]) {
+            old.apply(this, args)
+        }
+    })
+}
+
+@Component
+export default class Comp extends Vue {
+    @Log('prefix')
+    method() {
+
+    }
+}

docs/pt-br/custom/custom.md

@@ -0,0 +1,13 @@
+## Utilização
+
+Use `createDecorator` para construir seus próprios decorators.
+
+Se você é um autor de algum package, instale vue-facing-decorator como `devDependecies` e marque-a dentro de `peerDependencies`.
+
+
+`createDecorator` recebe uma função criadora, a qual aceita dois parâmetros: 
+
+1. Componentes Vue gerados com options API, você pode modifica-lo para implementar o que você quiser.
+2. A key da propriedade da classe(ou método), o qual o decorator irá ser aplicado.
+
+[](./code-usage.ts ':include :type=code typescript')