これは vue で何を指しているのでしょうか?

Vue では、この点はコンテキストによって異なります。メソッドは現在の Vue インスタンスを指します。テンプレートは、データ、プロパティ、計算されたプロパティ、メソッドなどのコンポーネント コンテキストを指します。デフォルトでは、イベント ハンドラーは DOM 要素を指します。この要素は、bind または v-on 修飾子を通じて Vue インスタンスにバインドできます。グローバル オブジェクトは Vue ルート インスタンスを指し、グローバル設定とメソッドにアクセスできます。

これは Vue で何を指しますか

Vue では、this キーワードは何を指しますか使用されるコンテキストに応じて、異なるオブジェクトに変換されます。

1. メソッドと計算プロパティ

メソッドと計算プロパティでは、this は現在の Vue インスタンスを指します。これは、インスタンスのデータとメソッドにアクセスできることを意味します。例:

methods: {
  logThis() {
    console.log(this);
  },
},

logThis メソッドを呼び出すと、this は現在の Vue インスタンスを指します。

2. テンプレート

テンプレートでは、this は、次のプロパティを含む現在のコンポーネントのコンテキスト オブジェクトを指します。

• #$data: コンポーネントのデータ オブジェクト
• $props: コンポーネントによって受け取られるプロパティ
• $computed : コンポーネントの計算されたプロパティ
• $methods : コンポーネントのメソッド

たとえば、次のテンプレートでは:

<template>
  <p>{{ this.$data.message }}</p>
</template>

この .$data.message は、コンポーネント data オブジェクトの message プロパティにアクセスします。

3. イベント ハンドラー

イベント ハンドラーでは、

this はイベントをトリガーした DOM 要素を指します。ただし、this は、bind または v-on 修飾子を使用して現在の Vue インスタンスにバインドできます。

例:

methods: {
  handleClick(event) {
    console.log(this); // 指向 Vue 实例
  },
},

<button @click="handleClick">Click Me</button>

4. グローバル オブジェクト

Vue ルート インスタンスの外側で、

this はグローバル オブジェクトを指します。 Vue オブジェクト。これは、グローバル設定と次のようなメソッドにアクセスできることを意味します:

console.log(this.$options.components); // 打印注册的全局组件
this.$mount(app); // 挂载 Vue 根实例

以上がこれは vue で何を指しているのでしょうか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。