LWC と Aura 間での JavaScript コードの共有

Lightning Web コンポーネントと Aura コンポーネントの間で JavaScript コードを共有するには、コードをサービスコンポーネントの ES6 モジュールに配置します。

ES6 モジュールを共有するには次の手順を実行します。

  1. Lightning Web Components プログラミングモデルを使用して、サービスコンポーネント (ライブラリ) を作成します。
  2. Lightning Web コンポーネントでコードを使用するには、コンポーネントの JavaScript ファイルでそのコードをインポートして参照します。
  3. Aura コンポーネントでコードを使用するには、Aura コンポーネントをインポートするのに使用する構文を使用して、そのメソッドをコールします。コード例は、Aura lightning:navigationItemAPI コンポーネントのドキュメントを参照してください。lightning:navigationItemAPI は ES6 モジュールではなく Aura コンポーネントですが、ES6 モジュールをインポートするには同じ Aura 構文を使用します。

lwc-recipes リポジトリには、Lightning Web コンポーネントと Aura コンポーネント間の通信を可能にする lmsPublisherWebComponent モジュールがあります。pubsub モジュールは廃止されましたが、Lightning Message Service をサポートしていない Experience Cloud などのコンテナでは使用できます。

関連トピック