Represents a navigation action. It can provide sub items.
The ui5-side-navigation-item is used within ui5-side-navigation or ui5-side-navigation-group only.
ES6 Module Import​
import "@ui5/webcomponents-fiori/dist/SideNavigationItem.js";
Properties​
expanded​
| Description | Defines if the item is expanded |
| Type | boolean |
| Default | false |
wholeItemToggleable​
| Description | Defines whether clicking the whole item or only pressing the icon will show/hide the sub items (if present). If set to true, clicking the whole item will toggle the sub items, and it won't fire the click event. By default, only clicking the arrow icon will toggle the sub items. |
| Type | boolean |
| Default | false |
| Since | 1.0.0-rc.11 |
| Description | Defines the icon of the item.
The SAP-icons font provides numerous options.
See all the available icons in the Icon Explorer. |
| Type | string |
| Default | "" |
selected​
| Description | Defines whether the item is selected |
| Type | boolean |
| Default | false |
| Description | Defines the link target URI. Supports standard hyperlink behavior. If a JavaScript action should be triggered, this should not be set, but instead an event handler for the click event should be registered. |
| Type | string |
| Default | "" |
| Since | 1.19.0 |
| Description | Defines the component target.
Notes:
- _self
- _top
- _blank
- _parent
- _search
This property must only be used when the href property is set. |
| Type | string |
| Default | "" |
| Since | 1.19.0 |
default​
| Description | Defines nested items by passing ui5-side-navigation-sub-item to the default slot. |
| Type | Array<SideNavigationSubItem> |
| Description | Fired when the component is activated either with a click/tap or by using the [Enter] or [Space] keys. |
| Type | CustomEvent |
Methods​
No methods available for this component.
CSS Parts​
No CSS parts available for this component.