Lightning コンポーネント開発者ガイド
jlightning:verticalNavigationItemBadge
lightning:verticalNavigationSection または lightning:verticalNavigationOverflow 内のリンクとバッジ。このコンポーネントでは、API バージョン 41.0 以降が必要です。
lightning:verticalNavigationItemBadge コンポーネントは、項目の表示ラベルの右に数値バッジを表示するナビゲーション項目です。
次に、バッジが含まれる項目を持つナビゲーションメニューを作成する例を示します。
1<aura:component>
2 <lightning:verticalNavigation selectedItem="recent">
3 <lightning:verticalNavigationSection label="Reports">
4 <lightning:verticalNavigationItemBadge label="Recent" name="recent" badgeCount="3" />
5 <lightning:verticalNavigationItem label="Created by Me" name="usercreated" />
6 <lightning:verticalNavigationItem label="Private Reports" name="private" />
7 <lightning:verticalNavigationItem label="Public Reports" name="public" />
8 <lightning:verticalNavigationItem label="All Reports" name="all" />
9 </lightning:verticalNavigationSection>
10 </lightning:verticalNavigation>
11</aura:component>属性
| 属性名 | 属性型 | 説明 | 必須項目 |
|---|---|---|---|
| body | Component[] | コンポーネントのボディ。マークアップでは、これはタグのボディに含まれるすべてを指します。 | |
| class | String | コンポーネントの基本クラスに加え、外部要素の CSS クラス。 | |
| title | String | マウスポインタが要素に重ねられたときにツールチップテキストを表示します。 | |
| label | String | このナビゲーション項目に表示するテキスト。 | はい |
| name | String | このナビゲーション項目の一意の識別子。 | はい |
| href | String | ナビゲーション項目の移動先のページの URL。 | |
| badgeCount | 数値 | バッジ内に表示するテキスト。この値がゼロの場合、バッジは非表示になります。 | |
| assistiveText | String | バッジ内の番号を説明する補助テキスト。これはアクセシビリティを向上するために使用され、ユーザには表示されません。 |