Aura コンポーネント イベント

概要

キモとなる機能のようだがイマイチTrailheadがわかりにくく悪戦苦闘
trailhead.salesforce.com

概要はこちらの方がわかりやすい
qiita.com

イベントの定義

<aura:event type="COMPONENT">
    <aura:attribute name="expense" type="Expense__c"/>
</aura:event>

コンポーネントからイベントの送信 (送信側)

<aura:registerEvent name="updateExpense" type="c:expensesItemUpdate"/>
...
<lightning:input type="toggle"
            label="Reimbursed?"
            name="reimbursed"
            class="slds-p-around_small"
            checked="{!v.expense.Reimbursed__c}"
            messageToggleActive="Yes"
            messageToggleInactive="No"
            onchange="{!c.clickReimbursed}"/>

• <aura:registerEvent>でイベントを登録しておく

コントローラーからイベントの取得と起動 (送信側)

({
    clickReimbursed: function(component, event, helper) {
        let expense = component.get("v.expense");
        let updateEvent = component.getEvent("updateExpense");
        updateEvent.setParams({ "expense": expense });
        updateEvent.fire();
    }
})

• component.getEvent()にてupdateExpense という名前のイベントを取得
  • 上記の引数は、expenseItem.cmpの<aura:registerEvent>のname属性にマッチさせる
• 取得したイベントにセットする形式:
  • {"イベントの名前属性", イベントにセットする値}

イベントの処理 (受信側)

     <aura:handler name="updateExpense" event="c:expensesItemUpdate" action="{!c.handleUpdateExpense}"/>

• nameは<aura:registerEvent>のname属性と同じにする。
• <aura:handler>が記述されているコンポーネントがイベントをListenする状態になるよう