The Salesforce Developers website will undergo maintenance on May 29, 2024 from 3:00 a.m. UTC to 10:00 a.m. UTC. The maintenance process may affect the availability of our documentation. Please plan accordingly.

囲んでいる Aura コンポーネントへのイベントの送信

子から親への通信を行うには、イベントをディスパッチします。Lightning Web コンポーネントは、DOM イベントを起動します。囲んでいる Lightning Web コンポーネントと同様に、囲んでいる Aura コンポーネントはこれらのイベントをリスンできます。囲んでいる Aura コンポーネントは、イベントを捕捉して処理できます。必要に応じて、Aura コンポーネントは Aura イベントを起動し、他の Aura コンポーネントやアプリケーションコンテナと通信できます。

このコードは、lwc-recipes リポジトリの categoryFilter コンポーネントと auraDomEventListener コンポーネントから引用されています。

次の例は、この手法を示しています。この Lightning Web コンポーネントは JavaScript ファイルでカスタム filterchange イベントを起動します。

囲んでいる Aura コンポーネントのラッパーはカスタムイベントにハンドラを追加します。イベントハンドラ onfilterchange は「on」のプレフィックスが付いたイベント名と一致します。つまり、onfilterchange を使用して、filterchange という名前のイベントを処理します。

onfilterchange ハンドラは、DOM イベントが伝達する最初の Aura コンポーネントでのみ指定できます。

Aura コンポーネントのコントローラは、イベントを受信します。イベントは好きなように処理できます。このコンポーネントは、Lightning Web コンポーネントイベントの details プロパティで渡される filters 配列を操作します。必要に応じて、新しい Aura イベントを起動して他の Aura コンポーネントと通信することもできます。

関連トピック