Simple Vue 
by Anthony Fu @antfu
> Traduzido pelo Google, abra um PR para ajudar a melhorar a tradução.
Implemente uma versão simplificada de suporte de digitação semelhante ao Vue.
Ao fornecer um nome de função `SimpleVue` (semelhante a `Vue.extend` ou `defineComponent`), ele deve inferir corretamente o tipo `this` dentro dos métodos computados e.
Neste desafio, assumimos que SimpleVue pega um objeto com campos `data`, `computed` e `methods` como apenas argumento,
- `data` é uma função simples que retorna um objeto que expõe o contexto `this`, mas você não estará acessível a outros valores ou métodos computados.
- `computed` é um Objeto de funções que toma o contexto como `this`, faz alguns cálculos e retorna o resultado. Os resultados calculados devem ser expostos ao contexto como valores de retorno simples em vez de funções.
- `methods` é um objeto de funções que também considera o contexto como `this`. Os métodos podem acessar os campos expostos por `data`, `computed` e também por outros `methods`. A diferença entre `computed` é que `methods` é exposto como funções como estão.
O tipo de valor de retorno de `SimpleVue` pode ser arbitrário.
```ts
const instance = SimpleVue({
data() {
return {
firstname: 'Type',
lastname: 'Challenges',
amount: 10,
}
},
computed: {
fullname() {
return this.firstname + ' ' + this.lastname
}
},
methods: {
hi() {
alert(this.fullname.toLowerCase())
}
}
})
```
Desafios Relacionados
