113. 简单的 Vue 类型

困难1

实现类似 Vue 的类型支持的简化版本。

通过提供一个函数 SimpleVue (类似于 Vue.extenddefineComponent ),它应该正确地推断出 computedmethods 内部的 this 类型。

在此挑战中,我们假设 SimpleVue 接受只带有 datacomputedmethods 字段的 Object 作为其唯一的参数:

  • data 是一个简单的函数,它返回一个提供上下文 this 的对象,但是你无法在 data 中获取其他的计算属性或方法。
  • computed 是将 this 作为上下文的函数的对象,进行一些计算并返回结果。在上下文中应暴露计算出的值而不是函数。
  • methods 是函数的对象,其上下文也为 this 。函数中可以访问 datacomputed 以及其他 methods 中的暴露的字段。 computedmethods 的不同之处在于 methods 在上下文中按原样暴露为函数。

SimpleVue 的返回值类型可以是任意的。

const instance = SimpleVue({
  data() {
    return {
      firstname: 'Type',
      lastname: 'Challenges',
      amount: 10,
    }
  },
  computed: {
    fullname() {
      return this.firstname + ' ' + this.lastname
    }
  },
  methods: {
    hi() {
      alert(this.fullname.toLowerCase())
    }
  }
})
评论(0)
题库

TypeScript

加载中...