Vue 3 関数で「this」が未定義として定義されているのはなぜですか

Question

Vue 3 の次の単純なコンポーネントの例を参照してください:

リーリー

one() 関数から two() 関数を呼び出すと、two 関数で this が発生する理由を理解しようとしています。 () 関数 真ん中は 未定義です。どちらの関数も setup() で返されるため、両方の関数が this にアクセスできることが期待されます。

そうは言っても、

two() 関数でコンポーネント インスタンス this への参照を取得するにはどうすればよいでしょうか?

Answer 1

Vue は依然として JavaScript のルールに従う必要があると思います。イベント ハンドラーが呼び出されるときは、通常、イベントを受信するオブジェクトのコンテキスト内で行われます。この場合、one() は <a> 要素の Proxy にバインドされ、this は # にバインドされます。 ＃＃プロキシ＃＃＃。 ただし、

two()

は、コンテキスト なしで具体的に 呼び出されます (つまり、someobject.foo()## の代わりに two() # ）。これは、this が未定義になることを意味します。 私は Vue にあまり詳しくありませんが、Vue はメソッドを自動的にバインドしないので、使用しないものに料金を支払う必要がないのだと思います。

one()

の

this

は適切にバインドされているため、実際には two() を this のメソッドとして使用できます。裸の関数としてではなく: リーリー