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 |
| 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 | undefined |
| Default | undefined |
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 | undefined |
| Default | undefined |
| 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 | undefined |
| Default | undefined |
| Since | 1.19.0 |
| Description | Defines the text of the item. |
| Type | string | undefined |
| Default | undefined |
disabled​
| Description | Defines whether the component is disabled. A disabled component can't be pressed or focused, and it is not in the tab chain. |
| Type | boolean |
| Default | false |
| Since | 1.19.0 |
| Description | Defines the tooltip of the component.
A tooltip attribute should be provided, in order to represent meaning/function, when the component is collapsed(icon only is visualized). |
| Type | string | undefined |
| Default | undefined |
| Since | 2.0.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.