ui:menuSelect
たとえば、ui:menuList コンポーネントはこのイベントを登録し、コンポーネントでイベントを起動できるようにします。
1<aura:registerEvent name="menuSelect" type="ui:menuSelect"
2 description="The event fired when a menu item is selected." />このイベントは ui:menuList コンポーネントインスタンスで処理できます。次の例に、2 つのリスト項目があるメニューコンポーネントを示します。ui:menuSelect イベントと click イベントを処理します。
1<ui:menu>
2 <ui:menuTriggerLink aura:id="trigger" label="Contacts"/>
3 <ui:menuList class="actionMenu" aura:id="actionMenu" menuSelect="{!c.selected}">
4 <ui:actionMenuItem aura:id="item1" label="All Contacts"
5 click="{!c.doSomething}"/>
6 <ui:actionMenuItem aura:id="item2" label="All Primary"
7 click="{!c.doSomething}"/>
8 </ui:menuList>
9</ui:menu>メニュー項目がクリックされると、click イベントが処理されてから、ui:menuSelect イベント (次の例の doSomething および selected クライアント側コントローラに���応) が処理されます。
1({
2 selected : function(component, event, helper) {
3 var selected = event.getParam("selectedItem");
4
5 // returns label of selected item
6 var selectedLabel = selected.get("v.label");
7 },
8
9 doSomething : function(component, event, helper) {
10 console.log("do something");
11 }
12})| 属性名 | 型 | 説明 |
|---|---|---|
| selectedItem | Component[] | 選択されているメニュー項目 |
| hideMenu | Boolean | True に設定した場合はメニューを非表示にします |
| deselectSiblings | Boolean | 現在選択されているメニュー項目の同階層を選択解除します |
| focusTrigger | Boolean | フォーカスを ui:menuTrigger コンポーネントに設定します |