uniapp メソッドでこれが無効になるのはどのような状況ですか?-uni-app-php.cn

uniapp メソッドでこれが無効になるのはどのような状況ですか?

PHPz

リリース： 2023-04-06 14:11:17

オリジナル

2000 人が閲覧しました

uniapp は Vue.js に基づいて開発されているため、uniapp でこれを使用するのが非常に一般的です。ただし、uniapp の一部のメソッドではこれが機能しない場合があります。どうしてこれなの？

uniapp では、これはデフォルトで Vue インスタンスオブジェクトを指します。このオブジェクトには、さまざまな Vue インスタンスのプロパティとメソッドが含まれます。ただし、一部のメソッドでは、これは Vue インスタンスオブジェクトを指しません。これらのメソッドは、uniapp の内部メソッドまたはサードパーティのプラグインのメソッドである可能性があります。

この場合、他の方法を使用して Vue インスタンスオブジェクトにアクセスする必要があります。一般的に使用されるメソッドをいくつか示します。

this.$parent

this.$parent は、現在のコンポーネントの親コンポーネントにアクセスでき、親コンポーネントには Vue インスタンスが含まれています。物体。したがって、this.$parent を通じて Vue インスタンスオブジェクト内のデータとメソッドにアクセスできます。

たとえば、次のメソッドを使用して、サブコンポーネント内の Vue インスタンスオブジェクトの testData データにアクセスできます:

this.$parent.testData

ログイン後にコピー

EventBus

# #EventBus は、異なるコンポーネント間でのデータの受け渡しの問題を解決するためによく使用されるメソッドでもあります。 Vue インスタンスオブジェクトでは、$emit メソッドを通じてイベントをトリガーし、他のコンポーネントの $on メソッドを通じてこのイベントをリッスンできます。

たとえば、Vue インスタンスオブジェクトでイベントをトリガーします:

this.$emit('testEvent', data)

ログイン後にコピー

他のコンポーネントでこのイベントをリッスンします:

this.$on('testEvent', (data) => {
  console.log(data)
})

ログイン後にコピー

このようにして、データはさまざまな方法で処理できます。コンポーネント渡され、処理されます。

$refs はコンポーネントで定義された ref 属性にアクセスでき、コンポーネントインスタンスとコンポーネントデータは ref 属性を通じてアクセスできます。

たとえば、コンポーネントで ref 属性を定義します:

<template>
  <div ref="myRef">Hello World</div>
</template>

ログイン後にコピー

コンポーネントメソッドで ref 属性にアクセスします:

this.$refs.myRef.innerHTML = 'Hello Uniapp'

ログイン後にコピー

これにより、コンポーネント内のデータを変更できます。

概要

uniapp の開発では、これが機能しないことが比較的よくあります。しかし、上で紹介したメソッドを使用すると、Vue インスタンスオブジェクト内のデータとメソッドに簡単にアクセスして、この問題を解決できます。

以上がuniapp メソッドでこれが無効になるのはどのような状況ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。