Lightning 基本コンポーネントでのイベント処理
基本コンポーネントは軽量で、HTML マークアップによく似ています。標準的な HTML の手法に従って、onfocus などのイベントハンドラを属性として提供します。ui 名前空間のコンポーネントのように、Lightning コンポーネントイベントを登録して起動するのではありません。
マークアップを見て、event.target または event.currentTarget を使用して DOM 要素にアクセスするのではないかと思うかもしれません。けれども、この方法によるアクセスでは、変更される可能性のある別のコンポーネントの DOM 要素にアクセス可能になるため、カプセル化が壊れます。
LockerService (Summer '17 ですべての組織で有効化になる予定) は、カプセル化を適用するものです。ここで説明するメソッドを使用して、コードを LockerService に対応させます。
イベントを起動したコンポーネントを取得するには、event.getSource() を使用します。
イベントハンドラの再利用
event.getSource() は、どのコンポーネントがイベントを起動したかを判断するうえで役立ちます。たとえば、同じ onclick ハンドラを再利用するボタンがいくつかあるとします。イベントを起動したボタンの名前を取得するには、event.getSource().get("v.name") を使用します。
onactive ハンドラを使用した有効なコンポーネントの取得
タブを使用する場合、どのタブが有効かを知る必要があります。lightning:tab コンポーネントを使用すると、onactive ハンドラを使用してターゲットコンポーネントが有効になったときに、ターゲットコンポーネントへの参照を取得できます。コンポーネントを数回クリックすると、ハンドラが 1 回だけ呼び出されます。
onselect ハンドラを使用した ID および値の取得
一部のコンポーネントは、イベントを子コンポーネントに渡すイベントハンドラを提供します。次のコンポーネントの onselect イベントハンドラなどです。
- lightning:buttonMenu
- lightning:tabset
event.detail 構文は引き続きサポートされますが、今後のリリースで event.detail は廃止される予定であるため、onselect ハンドラで次のパターンを使用するように JavaScript コードを更新することをお勧めします。
同様に、lightning:tabset コンポーネントで選択されたタブの ID を取得するには、次のコードを使用します。- event.getParam("id")
- event.getParam("value")