Salesforce コンソール開発者ガイド
jLightning コンソール JavaScript API でのイベントの使用
Lightning Web コンポーネント (LWC) のイベントの操作
Lightning メッセージサービス (LMS) チャネルは、Aura タブイベントごとに作成されます。LMS チャネルのペイロードは、Aura イベントのペイロードと同じです。リスン対象の Aura アプリケーションイベントに対応する Lightning メッセージチャネルを登録します。
LWC での LMS チャネルの登録
| Aura イベント | LMS チャネル | ペイロード |
|---|---|---|
| lightning:tabClosed | lightning__tabClosed | tabId |
| lightning:tabCreated | lightning__tabCreated | tabId |
| lightning:tabFocused | lightning__tabFocused | previousTabId、currentTabId |
| lightning:tabRefreshed | lightning__tabRefreshed | tabId |
| lightning:tabReplaced | lightning__tabReplaced | tabId |
| lightning:tabUpdated | lightning__tabUpdated | tabId |
LMS チャネルを登録するには、lightning/messageService モジュールと必要なチャネルをインポートします。以下の例では、@salesforce/messageChannel/lightning__tabCreated チャネルをインポートし、このチャネル経由で公開するメッセージを登録しています。
登録はコンポーネントの作成時に行い、登録解除はコンポーネントの破棄時に行います。詳細は、「メッセージチャネルの登録および登録解除」を参照してください。
1import { LightningElement, wire} from 'lwc';
2import { MessageContext, subscribe, unsubscribe } from 'lightning/messageService';
3import tabCreatedChannel from "@salesforce/messageChannel/lightning__tabCreated";
4
5export default class MyComponent extends LightningElement {
6 @wire(MessageContext) messageContext;
7 messageSubscription = null;
8
9 connectedCallback() {
10 this.unsubscribe();
11 this.messageSubscription = subscribe(this.messageContext, tabCreatedChannel, (message) => {
12 this.handleMessage(message);
13 });
14 }
15 disconnectedCallback() {
16 this.unsubscribe();
17 }
18
19 unsubscribe() {
20 if (!this.messageSubscription) {
21 return;
22 }
23 unsubscribe(this.messageSubscription);
24 this.messageSubscriptions = null;
25 }
26
27 handleMessage(message) {
28 if (!message || !message.tabId) {
29 return;
30 }
31 const tabId = { message };
32 console.log(`Tab with tabId of ${tabId} is created.`);
33 }
34}Aura コンポーネントのイベントの操作
イベントは、JavaScript コントローラーのアクションから起動されます。イベントには、そのイベントの起動前に設定可能で、処理時に読み取り可能な属性を含められます。Lightning コンソールアプリケーションで機能する各イベントが起動されると、参照可能な属性が返されます。各イベントで返される属性のリストは、このガイドの「参照」セクションを参照してください。
コンソールイベントを使用するには、Aura コンポーネントでハンドラーを設定します。たとえば、次のハンドラーは lightning:tabCreated イベントをリスンし、イベントの発生時にコンポーネントのコントローラーで onTabCreated 関数をコールします。
1<aura:handler event="lightning:tabCreated" action="{! c.onTabCreated }"/>より具体的な例を見てみましょう。次のコンポーネントでは、lightning:tabClosed イベントを使用します。
1<aura:component implements="flexipage:availableForAllPageTypes" access="global" >
2<aura:handler event="lightning:tabClosed" action="{! c.onTabClosed }"/>
3</aura:component>タブが閉じると、コンポーネントのコントローラーでイベントハンドラーが onTabClosed をコールし、閉じたタブの tabId を記録します。
1({
2 onTabClosed : function(component, event, helper) {
3 var tabId = event.getParam("tabId");
4 alert(“Tab with tabId of “ + tabId + “ was just closed.”);
5 }
6})ワークスペース API やユーティリティバー API で Lightning コンソールイベントを使用して、ユーザーエクスペリエンスをカスタマイズできます。たとえば、タブが更新されたときにタブをフォーカスしたり、タブが置き��えられたときにモーダルダイアログでユーザーに通知したりできます。