この文章は Salesforce 機械翻訳システムを使用して翻訳されました。詳細はこちらをご参照ください。

forceCommunity:navigationMenuBase

コミュニティのナビゲーションメニューをカスタマイズするための抽象コンポーネントで、メニューデータの読み込みとナビゲーションの処理を行います。メニューのデザインは、このメニューを拡張しているコンポーネントによって制御されます。

forceCommunity:navigationMenuBase コンポーネントを拡張して、カスタマーサービス (Napili) またはカスタムコミュニティテンプレート用にカスタマイズされたナビゲーションコンポーネントを作成します。コミュニティビルダーのメニューエディタまたは NavigationMenuItem エンティティを使用して、ナビゲーションメニューデータを指定します。

menuItems 属性には、それぞれ次のプロパティがある最上位のメニュー項目の配列が自動的に入力されます。

id: navigate メソッドで使用されます。
label: メニュー項目の表示ラベル。
subMenu: メニュー項目の配列 (省略可能)。

次に、カスタムナビゲーションメニューコンポーネントの例を示します。

1<aura:component extends="forceCommunity:navigationMenuBase" implements="forceCommunity:availableForAllPageTypes">
2    <ul onclick="{!c.onClick}">
3        <aura:iteration items="{!v.menuItems}" var="item" >
4            <aura:if isTrue="{!item.subMenu}">
5                <li>{!item.label}</li>
6                <ul>
7                    <aura:iteration items="{!item.subMenu}" var="subItem">
8                        <li><a data-menu-item-id="{!subItem.id}" href="">{!subItem.label}</a></li>
9                    </aura:iteration>
10                </ul>
11            <aura:set attribute="else">
12                <li><a data-menu-item-id="{!item.id}" href="">{!item.label}</a></li>
13            </aura:set>
14            </aura:if>
15        </aura:iteration>
16    </ul>
17</aura:component>

次に、コントローラの例を示します。

1({
2    onClick : function(component, event, helper) {
3        var id = event.target.dataset.menuItemId;
4        if (id) {
5            component.getSuper().navigate(id);
6         }
7   }
8})

メソッド

navigate(menuItemId): メニュー項目が指し示すページに移動します。メニュー項目の id をパラメータに取ります。

属性

属性名	属性型	説明	必須項目?
`body`	Component[]	コンポーネントのボディ。マークアップでは、これはタグのボディに含まれるすべてを指します。
`menuItems`	Object	メニュー項目のデータが自動的に入力されます。この属性は参照のみです。

Lightning コンポーネント開発者ガイド

forceCommunity:navigationMenuBase

属性