ui:menuList | Lightning コンポーネント開発者ガイド

このコンポーネントは ui:menu コンポーネント内にネストされ、ui:menuTriggerLink コンポーネントと一緒に使用できます。メニュートリガをクリックすると、コンテナとメニュー項目が表示されます。

1<ui:menu>
2    <ui:menuTriggerLink aura:id="trigger" label="Click me to display menu items"/>
3    <ui:menuList class="actionMenu" aura:id="actionMenu">
4        <ui:actionMenuItem aura:id="item1" label="Item 1" click="{!c.doSomething}"/>
5        <ui:actionMenuItem aura:id="item2" label="Item 2" click="{!c.doSomething}"/>
6        <ui:actionMenuItem aura:id="item3" label="Item 3" click="{!c.doSomething}"/>
7        <ui:actionMenuItem aura:id="item4" label="Item 4" click="{!c.doSomething}"/>
8   </ui:menuList>
9</ui:menu>

ui:menuList には、これらのコンポーネントを格納でき、クリックするとクライアント側のコントローラが実行されます。

ui:actionMenuItem
ui:checkboxMenuItem
ui:radioMenuItem
ui:menuItemSeparator

詳細は、ui:menuを参照してください。

属性

属性名	属性型	説明
`autoPosition`	Boolean	下に十分な表示スペースがない場合は、ポップアップターゲットを上に移動します。注意: autoPosition が false に設定されていても、ポップアップはメニューをトリガと相対的に位置付けます。デフォルトの位置指定を上書きするには、manualPosition 属性を使用します。
`body`	Component[]	コンポーネントのボディ。マークアップでは、これはタグのボディに含まれるすべてを指します。
`class`	String	コンポーネントに添付される CSS スタイル。このスタイルは、コンポーネントで出力される基本スタイルに追加されます。
`closeOnClickOutside`	Boolean	ユーザがターゲットの外側をクリックまたはタップしたら、ターゲットを閉じます。
`closeOnTabKey`	Boolean	Tab キーによってターゲットリストを閉じるかどうかを示します。
`curtain`	Boolean	ターゲットの下にフロート表示を適用するかどうか。
`menuItems`	List	Java クラスのインスタンス aura.components.ui.MenuItem を使用して明示的に設定されたメニュー項目のリスト。
`visible`	Boolean	メニューの表示設定を制御します。デフォルトは false で、メニューは非表示になります。

イベント

イベント名	イベントタイプ	説明
`dblclick`	COMPONENT	ユーザがコンポーネントをダブルクリックすると起動されるイベント。
`mouseover`	COMPONENT	ユーザがコンポーネントにマウスポインタを重ねると起動されるイベント。
`mouseout`	COMPONENT	ユーザがコンポーネントからマウスポインタを移動すると起動されるイベント。
`mouseup`	COMPONENT	ユーザがコンポーネント上でマウスボタンを放すと起動されるイベント。
`mousemove`	COMPONENT	ユーザがコンポーネントにマウスポインタを重ねると起動されるイベント。
`click`	COMPONENT	ユーザがコンポーネントをクリックすると起動されるイベント。
`mousedown`	COMPONENT	ユーザがコンポーネント上でマウスボタンをクリックすると起動されるイベント。
`menuExpand`	COMPONENT	メニューリストが表示されると起動されるイベント。
`menuSelect`	COMPONENT	ユーザがメニュー項目を選択すると起動されるイベント。
`menuCollapse`	COMPONENT	メニューリストが折りたたまれると起動されるイベント。
`menuFocusChange`	COMPONENT	メニューリストのフォーカスが 1 つのメニュー項目から別のメニュー項目に変更されると起動されるイベント。