Skip to content

Latest commit

 

History

History
41 lines (31 loc) · 3.49 KB

File metadata and controls

41 lines (31 loc) · 3.49 KB

Simple Vue 上級 #this #application #vue

by Anthony Fu @antfu

挑戦する    English 简体中文

この課題はGoogleが翻訳しました。翻訳品質改善のためのPRを募集しています。

Vueのようなタイピングサポートの簡易バージョンを実装します。

関数名SimpleVueVue.extendまたはdefineComponentに類似)を提供することにより、計算済みおよびメソッド内のthis型を適切に推測する必要があります。

この課題では、SimpleVueがdatacomputed、およびmethodsフィールドを持つオブジェクトを、それが唯一の引数であることを前提としています。

-dataは、コンテキストthisを公開するオブジェクトを返す単純な関数ですが、データ自体、またはdataの他のコンピューター値またはメソッドにはアクセスできません。

-computedは、コンテキストをthisとして受け取り、計算を行って結果を返す関数のオブジェクトです。計算結果は、関数ではなくプレーンな戻り値としてコンテキストに公開する必要があります。

-methodsは、コンテキストをthisとしても取る関数のオブジェクトです。メソッドは、datacomputed、および他のmethodsによって公開されるフィールドにアクセスできます。 computedの違いは、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())
    }
  }
})

戻る 解答を共有 解答を確認

関連する課題

213・Vue Basic Props